Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What are the common operations of JavaScript array

2025-02-24 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/01 Report--

This article mainly shows you "what are the common operations of the JavaScript array", the content is easy to understand, clear, hope to help you solve your doubts, the following let the editor lead you to study and learn "what are the common operations of the JavaScript array" this article.

Create an array

Creating an array is a basic skill, and its main methods include the following:

Const arr = [1Jing 2jue 3] / / Array literals const arr = [,] / / three-element vacant array (hole array) const arr = new Array (4) / / [,] const arr = new Array (4Jing 2) / [4JEO 2] const arr = Array.of (1Jing 2pm 3) / / [1m 2pm 3]

Among them, the most commonly used method is the array literal quantity method.

Determine whether it is an array or not

The main ways to determine whether an array is an array are:

/ / method 1 [1 object Array 2 instanceof Array// method 2] .constructor = Array// method 3 Object.prototype.toString.Call ([1 Magne2 Magne3]) = ='[object Array]'/ / method 4 Array.isArray ([1 Magne2 Magne3]) / / method 5 (compatible writing) function isArray (arr) {return Array.isArray? Array.isArray (arr): Object.prototype.toString.call (arr) = ='[object Array]'}

Generally speaking, the most commonly used method is the isArray method.

Conversion of class array and array

The data structure we sometimes encounter is not a pure array, but is generally classified as a "class array", which can be converted to a pure array in the following ways:

Const x = document.querySelectorAll ('a'); / / method 1-Array.prototype.slice.call (x); / / method 2-Array.from (x); Array.from (xrem mapFnmathisArg) / / method three [... x] / method four function toArray (x) {let res = [] for (item of x) {res.push (item)} return res} / / method five Array.apply (null,x) / / method six [] .concat.apply ([], x)

Methods five and six essentially take advantage of the characteristics of apply, that is, the second parameter passed to apply (array or class array) is converted into a list of parameters, which are then sent to the calling method (new Array or concat).

Array deduplication

When the array is deduplicated, you essentially need to compare whether two elements are equal, and if so, discard one element. In order to judge accurately, Object.is is used for comparison here.

1) weight removal by set

Set requires that the elements do not repeat, so you can de-duplicate the array after converting the array to set, and then convert it back to the array.

Function unique (arr) {return Array.from (new Set (arr)) / / return [... new Set (arr)]} 2) double cycle + splice

The outer loop iterates through all the elements, and the inner loop iterates through all the elements that follow the current element, and if it is found to be equal, it uses splice to remove one. Remember to roll back one bar at a time in the inner loop, otherwise some elements will be left out.

Function unique (arr) {for (let I = 0 bori)

< arr.length;i++){ for(let j = i + 1;i < arr.length;j++){ if(Object.is(arr[i],arr[j])){ arr.splice(j,1) j-- } } } return arr}3)新建数组 + includes 新建数组,每次往数组中添加元素之前都检查数组中是否已有该元素: function unique(arr){ const res = [] arr.forEach((item,index) =>

{/ / it is also possible to if (res.indexOf (item) = =-1), but cannot correctly judge NaN if (! res,includes (item)) {res.push (item)})} 4) reduce + includesfunction unique (arr) {return arr.reduce ((acc,cur) = > {/ / return acc.includes (cur)? Acc: acc.concat (cur) return acc.includes (cur)? Acc: [... acc,cur]}, [])} 5) create a new array + sort

According to sort's mechanism (toStrng is called on each element and then sorted at the string level), equal elements are grouped together. Create a new array and check whether the element is equal to the previous element each time you add an element to the array. Yes, it is a repeating element:

Function unique (arr) {arr.sort () const res = [arr [0]] for (let I = 1teri

< arr.length;i++){ if(!Object.is(arr[i],arr[i-1])){ res.push(arr[i]) } } return res}6)新建数组 + 利用对象属性 这种方法其实和"新建数组 + includes"一样。新建数组,每次往数组中添加元素之前都检查该元素是否已经作为对象的属性: // 对象属性值可以认为是元素重复的次数function unique(arr){ const res = [] const obj = {} arr.forEach((item,index) =>

{if (! obj [item]) {res.push (item) obj [item] = 1} else {obj [item] + +}}) return res}

The property name of the object is detected here, and the attribute name is essentially a string, so obj [true] and obj ["true"] are considered to be equal, resulting in the element true or element "true" not being put into the new array.

7) using map

The method is essentially the same as above, but there is no need to create a new array:

Function unique (arr) {let map = new Map () for (item of arr) {if (! map.has (item)) {map.set (item,true)}} return [... map.keys ()]} 8) filter + indexOf

To remove duplicate elements, to put it another way, is to retain those elements whose index is equal to the index when it first appeared. Such elements can be filtered out with filter and put into an array:

Function unique (arr) {return arr.filter ((item,index) = > index = arr.indexOf (item))}

The disadvantage of using indexOf is that NaN cannot be judged correctly.

These are all the contents of the article "what are the common operations of JavaScript arrays?" Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report