共计 2208 个字符，预计需要花费 6 分钟才能阅读完成。
之所以会单独针对这个 api 写这么一篇博文，一方面是因为最近在一次面试中聊到了这个 API，我没能完全说出它的用法；另一方面则是因为通过熟悉后觉得这个 api 确实很灵活很强大，充分体现了 javascript 的灵活性。所以写这么一篇博文，可以让自己更深刻地记住这个方法，也希望能让更多地同仁用这个方法让自己的 javascript 代码更加简洁，更加有效率。
MDN Web Docs 中对 Array.prototype.splice() 的描述信息如下
splice(start, deleteCount, item1, item2, …) 方法通过删除或替换现有元素和 / 或添加新元素来更改数组的内容。
传参信息如下
1. start 从什么位置开始修改当前数组，这个参数有如下几种情况
0 到数组长度 -1，即当前数组的任意位置。
大于数组长度 -1，不报错，但是不会删除当前数组的元素，第二个参数无效。但是，如果这个时候传入了第三个，以及第四个。。。参数，那么，这些参数值会被添加到数组的末尾位置，也就类似于 push 方法。
小于 0，如果开始位置为负数，会从数组的末尾倒着查找，如，- 1 为最后一个元素，- 2 为倒数第二个元素。
2. deleteCount 要删除的内容的长度，这个参数有如下几种情况
0 或负数 不删除数组元素。
大于 0 并且小于 start 指定位置到数组最后一个元素的长度，则删除指定长度的元素。
大于 start 指定位置到数组最后一个元素的长度，删除从 start 位置后面所有的元素，如 splice(0, 99999999) 会晴空长度小于 99999999 的数组
3. 在 start 位置开始要添加或者替换的元素，可以有多个。
针对上面的描述，我们一一验证它的所有用法。
删除元素（第二个参数不为 0，后续参数不传入，只删除）
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(1, 1); // 从第二个位置开始删掉一个元素
console.log(ary); // [‘a’, ‘c’, ‘d’, ‘e’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(1, 2); // 从第二个位置开始删掉两个元素
console.log(ary); // [‘a’, ‘d’, ‘e’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(-2, 1); // 删掉倒数第二个元素‘e’
console.log(ary); // [‘a’, ‘b’, ‘c’, ‘d’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(0, ary.length); // 删掉所有元素
console.log(ary); // []
添加元素 (第二个参数为 0，后续参数不为空，则只增加不删除)
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(ary.length, 0, ‘x’); // 在数组末尾追加一个元素
console.log(ary); // [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’, ‘x’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(1, 0, ‘x’); // 在数组第二个元素前插入一个元素
console.log(ary); // [‘a’,’x’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(-2, 0, ‘x’); // 在数组倒数第二个元素前插入一个元素
console.log(ary); // [‘a’, ‘b’, ‘c’, ‘d’, ‘x’, ‘e’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’];
let ary2 = [‘d’, ‘e’, ‘f’]
ary.splice(ary.length, 0, …ary2); // 数组拼接
console.log(ary); // [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’]
更新 / 替换元素（第二个参数不为 0，后续参数不为空，这里需要注意的是，传入的替换元素的个数可以等于前面的长度，也可以不等于前端的长度）
替换元素其实执行的是先删除再插入，所以一定要清楚传入参数的意义
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(1, 1, ‘x’); // 替换第二个元素‘b’为‘x’(长度和传入的替换元素个数都为一)
console.log(ary); // [‘a’, ‘x’, ‘c’, ‘d’, ‘e’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(1, 2, ‘x’); // 删掉第二个和第三个元素‘b’‘c’，插入一个元素‘x’(长度大于传入的替换元素个数)
console.log(ary); // [‘a’, ‘x’, ‘d’, ‘e’, ‘f’]
let ary = [‘a’, ‘b’, ‘c’, ‘d’, ‘e’, ‘f’];
ary.splice(1, 2, ‘x’, ‘y’, ‘z’); // 删掉第二个和第三个元素‘b’‘c’，插入三个元素‘x’，‘y’，‘z’(长度小于传入的替换元素个数)
console.log(ary); // [‘a’, ‘x’,’y’, ‘z’, ‘d’, ‘e’, ‘f’]
上面这些就是我目前总结的常用的 splice 的用法，如有更多使用方法，欢迎留言讨论
