JavaScript数组常用操作方法详解

JavaScript数组操作方法概述

JavaScript内置了丰富的数组对象方法，开发者可直接调用这些方法来执行各类数组处理任务。

join()字符串合并

join()方法

利用join()方法，可以将数组内的所有元素合并拼接为一个字符串。

var o = [1,2,3];
console.log(o.join());//1,2,3
console.log(o.join(" "));//1 2 3
var emptyArray = new Array(10);
console.log(emptyArray.join("-"));//----------

上述示例表明，当join()未传入参数时，JavaScript默认使用逗号作为分隔符连接所有成员；若传入参数，则该参数将作为自定义分隔符使用。

reverse()顺序反转

reverse()方法

调用reverse()可将数组元素的顺序完全颠倒。

//reverse()
o.reverse();
console.log(o);//[3,2,1]

观察可知，调用reverse()后，原数组本身的内容顺序会发生改变。

该语句执行后返回的是经过修改后的数组对象引用。

sort()排序处理

sort()方法

sort()用于对数组元素进行排序，默认情况下按字符串字典序（字母顺序）排列。与reverse()类似，sort()会直接修改原数组，并返回修改后的数组对象。

var a = ["Phone", "Mobile",,,"Canon"];
a.sort();
console.log(a);//["Canon", "Mobile", "Phone", undefined, undefined]
var b = [33,44,111];
console.log(b.sort());//[111, 33, 44]
console.log(b.sort(function(a,b){return a-b}));//[33, 44, 111]

可以看出，sort()支持接收一个比较函数作为参数，从而实现自定义排序逻辑。

concat()数组拼接

concat()方法

利用concat()方法可以实现数组的拼接操作。

var c = [1,2,3];
console.log(c.concat(4));//[1, 2, 3, 4]
console.log(c.concat(5,6));//[1, 2, 3, 5, 6]
console.log(c.concat([7,8]));//[1, 2, 3, 7, 8]
console.log(c.concat([9,10], [11,12]));//[1, 2, 3, 9, 10, 11, 12]
console.log(c.concat([42,43,[44,45]]));//[1, 2, 3, 42, 43, [44, 45]]
console.log(c);//[1, 2, 3]

与reverse()和sort()不同，concat()仅返回拼接后的新数组，不会对原数组产生任何修改。

slice()子数组截取

slice()方法

使用slice()可以从原数组中提取指定范围的子数组（sub-array）。

var d = [1,2,3,4,5,6];
console.log(d.slice(0,3));//[1,2,3]
console.log(d.slice(3,1));//[]

同concat()一样，slice()仅返回操作结果，不修改原数组。该方法接受两个参数，遵循“前包括后不包括”的原则：起始索引对应的元素包含在结果中，而结束索引对应的元素不包含。

splice()增删改操作

splice()方法

splice()用于对数组执行插入、删除或替换操作。其第一个参数指定操作起始位置（索引），第二个参数指定删除元素的个数；从第三个参数开始的所有后续参数，将被作为新元素插入到起始位置之前。splice()返回被删除元素组成的数组。与concat()和slice()不同，splice()会直接修改原数组。

var e = [1,2,3,4,5,6,7];
console.log(e.splice(1,2));//[2,3]
console.log(e);//[1,4,5,6,7]
console.log(e.length);//5
e.splice(1,0,2,3,[4,5]);
console.log(e);//[1, 2, 3, [4, 5], 4, 5, 6, 7]