On the operation method of JavaScript array

There are various ways to manipulate arrays in JavaScript, and the following examples illustrate the use of various methods:

Push

Add an element at the end of the array

var arr=[3,4,5,6]console.log(arr) //[3, 4, 5, 6]arr.push("evenyao") //字符串需要加""，数字不加console.log(arr) //[3, 4, 5, 6, "evenyao"]

Pop

Takes the last one out of the array and returns it, and the original array changes

var arr=[3, 4, 5, 6, "evenyao"]console.log(arr) //[3, 4, 5, 6, "evenyao"]var value = arr.pop() //arr.pop()的返回值就是取出的值，但这里是undefined是因为前面有var valueconsole.log(value) //"evenyao"console.log(arr) //[3, 4, 5, 6]

Shift

Takes the first bit of the array out and returns it, and the original array changes

var arr=["root",3, 4, 5, 6, "evenyao"]console.log(arr) //["root",3, 4, 5, 6, "evenyao"]var value = arr.shift()console.log(value) //"root"console.log(arr) //[3, 4, 5, 6, "evenyao"]

Unshift

Add an element to the first bit of the array

var arr=[3, 4, 5, 6, "evenyao"]console.log(arr) //[3, 4, 5, 6, "evenyao"]arr.unshift("root") //字符串需要加""，数字不加console.log(arr) //["root",3, 4, 5, 6, "evenyao"]

Join

The array element is linked into a string using parameters as a connector, and the contents of the original array are not modified

var arr=[3, 4, 5, 6, "evenyao"]console.log(arr.join(‘-‘)) //3-4-5-6-evenyaoconsole.log(arr) //[3, 4, 5, 6, "evenyao"]

Splice

The splice method is used for one-time solution of array additions, deletions (these two methods can be combined to achieve the substitution effect), the method has three parameters

1. Start indexing
2. Removing the displacement of an element
3. Insert a new element, of course, can also write multiple

Use splice to complete the removal

var arr=[3, 4, 5, 6, "evenyao"]var arr2 = arr.splice(1,2) //从下标为1的元素开始，取出2个元素作为一个数组的返回，原数组发生改变console.log(arr) //[3, 6, "evenyao"]console.log(arr2) //[4, 5]

Use splice to complete the new

var arr=[3, 4, 5, 6, "evenyao"]arr.splice(1,0,8,9,"yes") //从下标为1的位置（元素4）开始，删除0个，新增三个元素（8,9,"yes"），位置在（元素4）之前console.log(arr) //[3, 8, 9, "yes", 4, 5, 6, "evenyao"]

Slice

The element (interval) is taken as a new array. But not the same as the original array does not change

var arr=[3, 4, 5, 6, "evenyao"]var arr2 = arr.slice(2,3) //从arr下标为2开始，到下标为3结束（不包括3，即只取了一个），作为新数组，原数组不变console.log(arr) //[3, 4, 5, 6, "evenyao"]console.log(arr2) //[5]

Reverse

Reverse the array, modify the original array

var arr=[3, 4, 5, 6, "evenyao"]console.log(arr) //[3, 4, 5, 6, "evenyao"]arr.reverse()console.log(arr) //["evenyao", 6, 5, 4, 3]

Concat

Used to stitch an array, but does not modify any of the original arrays, nor does it recursively link an array of internal arrays

var a = [1,2,3,4,5];var b = [6,7,8,9];console.log(a.concat(b));//[1, 2, 3, 4, 5, 6, 7, 8, 9]console.log(a); //[1, 2, 3, 4, 5]console.log(b); //[6, 7, 8, 9]

And because it doesn't change any of the original arrays, you can use concat to make deep copies of the array, namely:

var arr=[3, 4, 5, 6, "evenyao"]var arr2 = arr.concat([]) //相当于和一个空数组进行了拼接，然后生成了arr2看上去和arr一模一样，但是却是两块不一样的内存空间console.log(arr) //[3, 4, 5, 6, "evenyao"]console.log(arr2) //[3, 4, 5, 6, "evenyao"]arr === arr2 //false

Sort

Used for sorting arrays, changing the original array

var arr=[5,4,3,2,1]arr.sort()console.log(arr) //[1, 2, 3, 4, 5]

But there are some situations where the situation becomes the following:

var arr=[7,8,9,10,11]arr.sort()console.log(arr) //[10, 11, 7, 8, 9]

Because the alphabet is 7:10 large, we need to pass in the custom sort function

var arr = [7,8,9,10,11]arr.sort(function(v1,v2){ return v1-v2})console.log(arr) //[7, 8, 9, 10, 11]

Other cases:

    var users = [{Name' AAA ',age: 21}, {name:  ' Baa ', age: 18}, { name:  ' abc ', age: 24}] //by age from small to large sort var SortByAge = Users.sort (function (v1, v2) { Span class= "Hljs-keyword" >return v1.age > v2.age}) //sort by name from large to small var sortbyname = Users.sort (function (v1, v2) {return v1.name > V2.name})      

How to manipulate JavaScript arrays