JavaScript Array 原型方法 大盘点

数组是一个超常用的数据结构，JavaScript的数组方法都有什么怎样的特性呢？

是时候一探究竟了。

JavaScript中数组是一个对象，默认的赋值是传了一个引用。针对结果是引用还是拷贝，对原数组的变更与否，分为两类方法：必写方法、只读方法。

必写方法

列举了一些会造成数组本身的内容发生改变的方法。

splice

Array.prototype.splice(start: number, deleteCount: number, ...items: any[]): any[]

arr.splice(start, deleteCount, …items) 是将arr[start, start + deleteCount) 的部分裁去，然后在这里插入items。
这个 splice 的表达能力非常强大，在数组的特定位置裁一刀，并用一个数组补上去。并返回因为被裁掉而生成的数组。虽然它看起来是块级的操作好像可以实现常数时间复杂度，但是其实它是一个线性的操作，从参数列表中可以看出它是线性的。

思考：splice 对于插入参数的长度而言的插入效率如何？[如果Array以链表实现，插入的代价最快是常数时间的]

参考：是线性时间复杂度的，而不是常数时间的。注意它的参数列表，传参方式决定了它是逐一处理参数的。例如调用splice(0, 0, [1, 2]) 的结果是插入了一个[1, 2] 而不是1, 2 这两个数。

copyWithin

Array.prototype.copyWithin(target: number, start: number, end: number): this

arr.copyWithin(target, start, end) 是将 arr[start, end) 这部分先做一个拷贝，然后再贴到从arr[target] 开始的位置。

思考：如何用 splice 实现 copyWithin？
提示：使用字符串构造函数。

fill

Array.prototype.fill(value: number, start: number, end: number): this

arr.fill(value, start, end) 是将 arr[start, end) 的部分都填充成同一个 value。
这提供了一种简单的数组初始化方式。

var arr = [1, 2, 3];
arr.fill(0, 1, 2); // [1, 0, 3]
arr.fill(0); // [0, 0, 0]

在填充对象时要注意：

var arr = [{}, {}];
arr[0] == arr[1]; // false
arr.fill({}); // [{}, {}]
arr[0] == arr[1]; // true

push, unshift, pop, shift

Array.prototype.push(...items: any[]): number
Array.prototype.unshift(...items: any[]): number
Array.prototype.pop(): any
Array.prototype.shift(): any

将Array看作是一个双向队列（deque）可能是比较恰当的。

• 从头部插入：unshift
• 从尾部插入：push
• 从头部删除：shift
• 从尾部删除：pop

提示：组合使用 push 与 pop 可以使得 Array 变成一个栈；组合使用 push 与 shift 可以使得 Array 变成一个队列。

思考：组合使用 unshift 与 shift 是否实现了栈？组合使用 unshift 与 pop 是否实现了队列？

参考：是，但这种方式有一个小坑点。因为从结果上说，unshift(1, 2)与先后调用 unshift(1), unshift(2)不同。可以推测，unshift与push是splice的特殊情况。unshift(…items) 与 splice(0, 0, …items) 是一致的，push(…items) 与 splice(this.length, 0, …items) 是一致的。BTW，shift() 与 splice(0, 1) 一致； pop()与splice(this.length - 1, 1) 一致；

sort

Array.prototype.sort(sortFn: (a: any, b: any) => number): this

将数组排序，默认使用升序，会改变数组自身。

var arr = [2, 1];
arr.sort(); // [1, 2]
arr.sort((a, b) => b - a); // [2, 1]

reverse

Array.prototype.reverse(): this

将数组反转，会改变数组自身。

var arr = [1, 2, 3];
arr.reverse(); // [3, 2, 1];
arr; // [3, 2, 1];

乍一想，反转可以算是一种按照索引号反序的特殊的排序，但 sort 的比较函数不能按照索引号写，这就比较尴尬了。

var arr = [1, 2, 3];
arr = arr.map((v, i) => { return {value: v, index: i}; }).sort((a, b) => b.index - a.index).map(v => v.value); // [3, 2, 1]

当然，这种方式看起来简直蠢爆了，从时间、空间效率上看都不能采用，只是体现了一种思路。

只读方法

forEach

提供了一种遍历数组的方法。

Array.prototype.forEach(callbackFn: (value: any, index: number, array: this) => undefined, thisArg: any): undefined

forEach 与 for 循环

var arr = [1, 3];
arr.forEach(v => arr.push(v)); // undefined
arr;