JavaScript数组方法整理 - 一看就懂

push()

向数组的末尾添加一个或更多元素,并返回数组新的长度。(改变了原数组)

1
2
3
let arr = ['a', 'b', 'c'];
arr.push('dd', 'ee');
console.log(arr); //[ 'a', 'b', 'c', 'dd', 'ee' ]

pop()

删除数组的最后一个元素并返回删除的元素。

1
2
3
4
let arr = ['a', 'b', 'c', 'd', 'e'];
let newArr = arr.pop();
console.log(arr); //[ 'a', 'b', 'c', 'd' ]
console.log(newArr);//e

unshift()

向数组的开头添加一个或更多元素,并返回新数组的长度。

  • 注意:当使用多个参数调用unshift()时他得行为令人惊讶。参数是一次性插入的(就像splice()方法)而非一次一个地插入。这意味着最终的数组中插入的元素的顺序和他们在参数中的顺序一致。
1
2
3
let arr = ['a', 'b', 'c'];
arr.unshift('dd', 'ee');
console.log(arr); //[ 'dd', 'ee', 'a', 'b', 'c' ]

shift()

删除并返回数组的第一个元素。

1
2
3
4
let arr = ['a', 'b', 'c', 'd', 'e'];
let newArr = arr.shift();
console.log(arr); //[ 'b', 'c', 'd', 'e' ]
console.log(newArr);//a

concat()

连接两个或更多的数组,并返回结果。

1
2
3
4
let arr1 = ['a', 'b', 'c'];
let arr2 = [1, 2, 3];
let arr = arr1.concat(arr2);
console.log(arr);//[ 'a', 'b', 'c', 1, 2, 3 ]

join()

方法将数组中所有元素都转化为字符串并连接在一起,返回最后生成的字符串,不改变原数组

1
2
3
4
5
6
let a = [1, 2, 3];
let b = a.join();
let c = b.split('2');
console.log(a);//[ 1, 2, 3 ]
console.log(b);//1,2,3
console.log(c);//[ '1,', ',3' ]

reverse()

方法将数组中的元素颠倒顺序,返回逆序的数组,改变了原数组

1
2
3
4
let arr = [1, 3, 'a', 'b', 2];
let a = arr.reverse().join();
console.log(arr);//[ 2, 'b', 'a', 3, 1 ]
console.log(a)//2,b,a,3,1

sort()

方法将数组中的元素排序并返回排序后的数组。改变原数组。不带参数时数组元素以字母表顺序排序,按照其他方式而非字母表顺序进行数组排序,必须传递一个比较函数

1
2
3
4
5
6
7
8
9
10
11
12
13
14
let arr = ['b', 'c', 'a'];
arr.sort();
console.log(arr);//[ 'a', 'b', 'c' ]
let arr2 = [33, 4, 1111, 222];
arr2.sort();//字母表顺序
console.log(arr2);//[ 1111, 222, 33, 4 ]
arr2.sort(function (a, b) {
return a - b;
});
console.log(arr2);//[ 4, 33, 222, 1111 ]
arr2.sort(function (a, b) {
return b - a;
});
console.log(arr2);//[ 1111, 222, 33, 4 ]

slice()

方法返回一指定数组的一个片段或子数组(不改变原数组)。他的两个参数分别指定了片段的开始和结束位置。返回的数组包含第一个参数指定的位置和所有到但不含第二个参数指定的位置之间的所有数组元素。

  • 如果只指定一个参数,返回的数组将包含从开始位置到数组结尾的所有元素。

  • 如果参数出现负数,他表示相对于数组中最后一个元素的位置。例如,参数-1指定了最后一个元素,而-3指定了倒数第三个元素。

1
2
3
4
5
6
7
8
9
10
11
12
13
let arr = [1, 2, 3, 4, 5];
let a = arr.slice(0, 3);
console.log(arr);//[ 1, 2, 3, 4, 5 ]
console.log(a);//[ 1, 2, 3 ]
let b = arr.slice(3);
console.log(arr);//[ 1, 2, 3, 4, 5 ]
console.log(b);//[ 4, 5 ]
let c = arr.slice(1, -1);
console.log(arr);//[ 1, 2, 3, 4, 5 ]
console.log(c);//[ 2, 3, 4 ]
let d = arr.slice(-3, -2);
console.log(arr);//[ 1, 2, 3, 4, 5 ]
console.log(d);//[ 3 ]

splice()

方法是在数组中插入或删除元素的通用方法(改变原数组)。

  • 第一个参数指定了插入和(或)删除的起始位置。第二个参数指定了应该从数组中删除的元素的个数。

  • 如果省略第二个参数,从起始点开始到数组结尾的所有元素都将被删除。

  • splice()返回一个由删除元素组成的数组,或者如果没有删除元素就返回一个空数组。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
let arr = [1,2,3,4,5,6,7,8];
let a = arr.splice(4);
console.log(arr);//[ 1, 2, 3, 4 ]
console.log(a);//[ 5, 6, 7, 8 ]
let b = arr.splice(1,2);
console.log(arr);//[ 1, 4 ]
console.log(b);//[ 2, 3 ]
//splice()的前两个参数指定了需要删除的数组元素。紧随其后的任意个参数指定了需要插入到数组中的元素,从第一个参数指定的位置开始插入。
let arr2 = [1,2,3,4,5];
let c = arr2.splice(2,0,'a','b');
console.log(arr2);//[ 1, 2, 'a', 'b', 3, 4, 5 ]
console.log(c);//[]
let d = arr2.splice(2,2,[1,2],3);
console.log(arr2);//[ 1, 2, [ 1, 2 ], 3, 3, 4, 5 ]
console.log(d);//[ 'a', 'b' ]

toString()

(对象方法)针对数组,该方法将其每个元素转化为字符串(如有必要将调用元素的toString()方法)并且输出逗号分隔的字符串列表。

  • 注意:这里与不使用任何参数调用join()方法返回的字符串是一样的。
1
2
3
4
let arr = [1,2,3];
let a = arr.toString();
console.log(arr);//[ 1, 2, 3 ]
console.log(a);//1,2,3

copyWithin()

从数组的指定位置拷贝元素到数组的另一个指定位置中。改变原数组

1
2
3
4
5
6
7
8
9
10
11
// array.copyWithin(target, start, end).
// target 必需。复制到指定目标索引位置。
// start 可选。元素复制的起始位置。
// end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
let arr = ['a', 'b', 'c', 'd', 'e'];
let arr1 = arr.copyWithin(2, 1);//复制数组前五个元素到第三第四第五的位置上
console.log(arr1); // [ 'a', 'b', 'b', 'c', 'd' ] 此时原数组已经改变
let arr2 = arr.copyWithin(2, 0, 2);//复制数组的前面两个元素(不包括第三个元素)到第三第四和第五个位置上:
console.log(arr2); //[ 'a', 'b', 'a', 'b', 'd' ] 此时原数组已经改变
let arr3 = arr.copyWithin(1, 0, -3);//复制数组的 0 到 1(-3倒着数,不包括-3)元素到第三的位置
console.log(arr3); //[ 'a', 'a', 'b', 'b', 'd' ] 此时原数组已经改变
海盗船长 wechat
扫码关注我的公众号哟
0%