Detailed explanation of the use of js array prototype method

This time I will bring you a detailed explanation of the use of the js array prototype method. What are the precautions for using the js array prototype method? The following is a practical case, let's take a look.

push

will change the original array, the return value is the changed array length

var arr = [1,2,3];
var length = arr.push(4,5)
console.log('length: ' + length + '  arr: ' + arr)
//     length: 5  arr: 1,2,3,4,5

pop

will change the original array, the return value is the popped element value

var arr = [1,2,3];
var val = arr.pop()
console.log('val: ' + val + '  arr: ' + arr)
// val: 3  arr: 1,2

unshift

will change the original array, and the return value is the changed array length

var arr = [1,2,3];
var length = arr.unshift('haha')
console.log('length : ' + length + '  arr: ' + arr)
// length : 4  arr: haha,1,2,3

shift

will change the original array, and the return value is the shifted element value

var arr = [1,2,3];
var val = arr.shift()
console.log('val: ' + val + '  arr: ' + arr)
// val: 1  arr: 2,3

concat

will not change the original array, the return value is a new array

var arr = [1,2,3];
var arr1 = arr.concat(['haha','hehe'])
console.log('arr : ' + arr + '  arr1: ' + arr1)
// arr : 1,2,3  arr1: 1,2,3,haha,hehe

reverse

will change the original array, the return value is the original array

var arr = [1,2,3];
var arr1 = arr.reverse(); // [3,2,1]
console.log('arr: ' + arr + '   arr1: ' + arr1)
// arr: 3,2,1   arr1: 3,2,1

slice( start, end)

Select some elements from the original array (the subscripts are elements from start to end-1) to form a new array. Both start and end can be negative numbers. The stipulation is to count from the end of the array. -1 refers to the last element, -2 refers to the second to last element, and so on.
will not change the original array, and the return value is a new array.

// 有end
var arr = [1,2,3,4];
var arr1 = arr.slice(1,3); // 1：起始下标，3：结束下标
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,2,3,4    arr1: 2,3
// 无end，那么切分的数组包含从 start 到数组结束的所有元素
var arr = [1,2,3,4];
var arr1 = arr.slice(1); // 1：起始下标
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,2,3,4    arr1: 2,3,4
// end为负数
var arr = [1,2,3,4];
var arr1 = arr.slice(1, -2);
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,2,3,4    arr1: 2
// start为负数
var arr = [1,2,3,4];
var arr1 = arr.slice(-3, -2);
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,2,3,4    arr1: 2

splice()

Delete , insert and replace the original array. Returning an array composed of deleted items will change the original array, and the return value is a new array

// 删除
var arr = [1,2,3,4,5];
var arr1 = arr.splice(1,2); // 1：起始下标，2：删除的项数
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,4,5    arr1: 2,3
// 插入
var arr = [1,2,3,4,5];
var arr1 = arr.splice(1,0,'a','b'); // 1：起始下标（在此下标之前插入），0：不删除，'a'和'b'是要插入的元素
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,a,b,2,3,4,5    arr1: []
// 替换
var arr = [1,2,3,4,5];
var arr1 = arr.splice(1,2,'a','b','c'); // 1：起始下标，2：删除的项数，'a','b','c'是要插入的元素
console.log('arr: ' + arr + '    arr1: ' + arr1)
// arr: 1,a,b,c,4,5    arr1: 2,3

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other php Chinese websites related articles!

Recommended reading:

Using analysis in avalon front-end project

Using CSS to implement table tennis fighting animation

The above is the detailed content of Detailed explanation of the use of js array prototype method. For more information, please follow other related articles on the PHP Chinese website!