Common methods for JavaScript arrays

Today brings you the common methods of JavaScript manipulation of arrays and their common scenarios.

Ways to add elements to an array:

1.Array.push(value1,value2,... ）

• Append to the end of the array
• The return value is the new length of the array after the data is added.
• changes the original array

let arr = [1,2,3];
let result= arr.push(4,5);
console.log(result)   //5
console.log(arr)    //[1,2,3,4,5]

2.Array.unshift(value1,value2,...)

• Add to the beginning of the array
• The return value is the new length of the array after the data is added.
• changes the original array

let arr = [1,2,3];
let result= arr.unshift(4,5);
console.log(result)   //5
console.log(arr)    //[4,5,1,2,3]

3.splice(index,0,value1,value2,...)

• Insert at the specified index of the array
• The deleted element is returned.
• changes the original array

If only two parameters are passed in, it is to remove the number of parameters 2 from the position of Parameter 1

let arr = [1,2,3];
let result = arr.splice(2,0,4,5);
console.log(result)   //Array(0)
console.log(arr)    //[1,2,4,5,3]

Ways to remove elements from an array:

1.pop()

• Remove an element from the tail
• Returns the deleted element.
• changes the original array

let arr = [1,2,3];
let result = arr.pop();
console.log(result)   //3
console.log(arr)    //[1,2]

2.shift()

• Remove an element from the head
• Returns the deleted element.
• changes the original array

let arr = [1,2,3];
let result = arr.shift();
console.log(result)   //1
console.log(arr)    //[2,3]

3.splice(index,howmany)

• Remove the howmany element at index,
• A collection of deleted elements is returned.
• changes the original array

let arr = [1,2,3];
let result = arr.splice(1,2);
console.log(result)   //[2,3]
console.log(arr)    //[1]

1.reverse()

• Invert, invert
• This method changes the original array.

let arr = [1,2,3];
let result = arr.reverse();
console.log(result)   //[3,2,1]
console.log(arr)    //[3,2,1]

2.sort()

• Sort by specified rule
• Change the original array.

let arr = [2,1,3];
let result = arr.sort();
console.log(result)   //[1,2,3]
console.log(arr)    //[1,2,3]

Note: If you think the sort method is to sort arrays from small to large, that's wrong. We can change the array just now and add some larger numbers.

let arr = [25,148,12,6,38];
let result = arr.sort();
console.log(result)   //[12, 148, 25, 38, 6]
console.log(arr)    //[12, 148, 25, 38, 6]

Are some friends a little confused now? But we can still find some regularity, he is first according to the size of the first character of a number to do the comparison, and then use the second character to do the comparison, small in front, if friends want to make this array from really small to really big sort, then we can modify the code just now.

let arr = [25,148,12,6,38];
let result = arr.sort((a,b) => a - b);
console.log(result)   //[6, 12, 25, 38, 148]
console.log(arr)    //[6, 12, 25, 38, 148]

If you want to sort from large to small

let arr = [25,148,12,6,38];
let result = arr.sort((a,b) => b - a);
console.log(result)   //[148, 38, 25, 12, 6]
console.log(arr)    //[148, 38, 25, 12, 6]

In general, the arguments in the array's sort method are a callback function, with two values, the return value is small to large if the first value minus the second value, and if the second value minus the first value is sorted from large to small.

How arrays are connected:

1.concat()

• Array connection
• Returns a new array after the connection.

let arr = [25,148,12,6,38],
    arr2 = [1,5,8]
let result = arr.concat(arr2);
console.log(result)   //[25, 148, 12, 6, 38, 1, 5, 8]
console.log(arr)    //[25, 148, 12, 6, 38]

2.join()

• Connect each element of the array to a character with a specified separator (default is ",").
• Returns the string after the connection is complete.

let arr = [25,148,12,6,38];
let result = arr.join(),
    result2 = arr.join('+')
console.log(result)   //25,148,12,6,38
console.log(result2)   //25+148+12+6+38
console.log(arr)    //[25, 148, 12, 6, 38]

How to intercept an array:

1.slice(start,end)

• From the start index, intercept to the end index
• Returns the collection of elements intercepted. N ote: If you do not pass the value, you copy the value of an array directly. e nd can pass a value that represents intercepting to the end of an array. Start and end can also take negative values, which represent a backward forward count.

let arr = [1,2,3,4,5,6,7];
let result = arr.slice(),
    result2 = arr.slice(2),
    result3 = arr.slice(2,4);
console.log(result)   //[1, 2, 3, 4, 5, 6, 7]
console.log(result2)   //[3, 4, 5, 6, 7]
console.log(result3)    //[3, 4]
console.log(arr)    //[1, 2, 3, 4, 5, 6, 7]

Method of array conversion:

1.toString()

• Converted to a string, consistent with a non-pass parameter(join), you can also use a 2,8,16-in system to convert to a different result.

let arr = [1,2,3,4,5,6];
let result = arr.toString();
console.log(result)   //1,2,3,4,5,6
console.log(arr)    //[1,2,3,4,5,6]

Method to extract the depth specified by the array

Let's say there's an array like this now: "1,2,"3,4,5,6", and I want to output it as a "1,2,3,4,5,6". I t's more troublesome if you write recursively yourself. T hen we can use the flat method of the array itself for deep resolution. 1.flat()

• Recursively traverses the array at the specified depth
• The return value is a collection of all elements that are traversed.

let arr = [1,2,[3,4,[5,6]]],
    res = arr.flat(Infinity),  //无限递归，直到最后
    res2 = arr.flat();      //如果不传参数那么只递归一次
console.log(arr)   //[1,2,[3,4,[5,6]]]
console.log(res)   //[1, 2, 3, 4, 5, 6]
console.log(res2)   //[1,2,3,4,[5,6]]