吐槽Javascript系列二：数组中的splice和slice方法

战斗英雄你当，漂亮媳妇儿你娶，怎么啥好事都被你给占了——《激情燃烧的岁月》

谈起这两个方法，新手不蒙，我是不信！正如 吐槽Javascript系列一：slice()、substr()和 substring() 中提到的，字符串中也有一个slice方法，极易混淆！

但其实呢，在数组中，他们还是很好区分的。

splice

splice，译为拼接，它的功能非常强大，能够删除，新增，修改原数组，功能三合一哦，我们先来看它的删除功能：

// 删除
let colors = ['red', 'green', 'blue']
let removed = colors.splice(0, 1)
console.log(removed) // [ 'red' ]
console.log(colors) // [ 'green', 'blue' ]

上面代码中，splice接收了二个参数，第一个参数表示要删除的第一项的位置，第二个参数表示要删除的项数。

我们再来看看它的添加功能：

// 添加
let colors = ['red', 'green', 'blue']
let removed = colors.splice(1, 0, 'yellow', 'orange')
console.log(removed) // []
console.log(colors) // [ 'red', 'yellow', 'orange', 'green', 'blue' ]

上面代码中，splice接收了四个参数，第一个参数表示要删除的第一项的位置，第二个参数表示要删除的项数，从第三个参数开始，表示要添加的项。

我们再来看看它的替换功能：

// 替换
let arr = ['red', 'green', 'blue', 'yellow']
let arr1 = arr.slice(1)
let arr2 = arr.slice(1, 2)

console.log(arr1) // [ 'green', 'blue', 'yellow' ]
console.log(arr2) // [ 'green' ]
console.log(arr) // [ 'red', 'green', 'blue', 'yellow' ]

上面代码中，splice接收了三个参数，第一个参数表示要删除的第一项的位置，第二个参数表示要删除的项数，第三个参数表示要添加的项。

原来，它的替换功能实际上是通过删除和添加来完成的。

说完splice，接下来说slice。

slice

slice，译为切开，我们来看例子：

// slice
let arr = ['red', 'green', 'blue', 'yellow']
let arr1 = arr.slice(1)
let arr2 = arr.slice(1, 2)

console.log(arr1) // [ 'green', 'blue', 'yellow' ]
console.log(arr2) // [ 'green' ]
console.log(arr) // [ 'red', 'green', 'blue', 'yellow' ]

slice接受一或两个参数，即要返回项的起始和结束位置。在只有一个参数的情况下，slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。它并不改变原数组。

吐槽

我曾经一直困惑数组中的删除方法，当知道删除这项伟大的任务竟然交给了splice，我心里是失望的。

不应该是del或者remove才像话吗？删除的功能它占了也就算了，添加的功能它也占了！它既能添加，也能删除，还能拼接，那它为什么没有七十二变？