我们相信：世界是美好的，你是我也是。 来玩一下解压小游戏吧！

苏南大叔在本文中描述一个js的splice函数，和数组切割函数slice类似，splice也是一个对数组进行切割的函数。splice在切割数组的同时，还可以组装数组。这是splice和slice最明显的区别。

苏南大叔：如何理解js数组的splice函数？和slice函数有何区别？ - splice-slice
如何理解js数组的splice函数？和slice函数有何区别？（图3-1）

苏南大叔的程序如此灵动博客，记录苏南大叔的代码所学所想。本文测试环境：node@16.14.2。

splice对比slice

被剪切的内容 = 会被修改的数组.splice(起始位置,长度,被添加到起始位置的内容)
JavaScript
被剪切的内容 = 数组.slice(起始位置(包含),终止位置(不包含))
JavaScript
对比点spliceslice
修改原函数是否
返回值被剪切的内容被剪切的内容
不传递参数可以可以
第一个参数剪切的起始点（包括）剪切的起始点（包括）
第二个参数剪切的长度剪切的终点（不包括）
第二个参数为零表述不剪切0号为第一个位置，返回开头位置
第二个参数为负数无效不报错有效负数位置，但是[起始位置,终点位置)
剩余参数作为添加的内容无效不报错

splice测试代码

应该注意到一个非常有意思的事情，这个list是使用const定义的。按理说是个不能被修改的常量。我们用函数去修改它的时候，会报错。但是，splice()函数却具有修改变量的能力。所以，奇怪的事情就这么发生了，一个不能被修改的常量就被修改了。

const list = ['sunan0', '苏南1', 'sunan大叔2'];
var tmp = list.splice();                       // 不做任何操作，返回空
console.log(list, tmp);
// [ 'sunan0', '苏南1', 'sunan大叔2' ] []
JavaScript
const list_ = ['sunan0', '苏南1', 'sunan大叔2'];
var tmp_ = list_.splice(1);                    // 1号及以后都删除
console.log(list_, tmp_);
// [ 'sunan0' ] [ '苏南1', 'sunan大叔2' ]
JavaScript
const list_0 = ['sunan0', '苏南1', 'sunan大叔2'];
var tmp_0 = list_0.splice(1, -1);               // 不做任何操作，返回空
console.log(list_0, tmp_0);
// [ 'sunan0', '苏南1', 'sunan大叔2' ] []
JavaScript
const list_1 = ['sunan0', '苏南1', 'sunan大叔2'];
var tmp_1 = list_1.splice(1, 1);               // 删除1个，无新数据
console.log(list_1, tmp_1);
// [ 'sunan0', 'sunan大叔2' ] [ '苏南1' ]
JavaScript
const list_2 = ['sunan0', '苏南1', 'sunan大叔2'];
var tmp_2 = list_2.splice(1, 0, '苏南大叔');   // 删除0个，新数据成为新的1号，实际效果为添加
console.log(list_2, tmp_2);
// [ 'sunan0', '苏南大叔', '苏南1', 'sunan大叔2' ] []
JavaScript
const list_3 = ['sunan0', '苏南1', 'sunan大叔2'];
var tmp_3 = list_3.splice(1, 2, '苏南大叔啊', '真的苏南大叔'); 
// 在1号位置（包括1号）删除2个，新的数据为1号，实际效果为替换
console.log(list_3, tmp_3);
// [ 'sunan0', '苏南大叔啊', '真的苏南大叔' ] [ '苏南1', 'sunan大叔2' ]
JavaScript

苏南大叔：如何理解js数组的splice函数？和slice函数有何区别？ - splice
如何理解js数组的splice函数？和slice函数有何区别？（图3-2）

对照组，slice测试代码

const list_4 = ['sunan0', '苏南1', '-1sunan大叔2'];
var tmp_4 = list_4.slice(1);        // [1,)
console.log(list_4, tmp_4);
// [ 'sunan0', '苏南1', '-1sunan大叔2' ] [ '苏南1', '-1sunan大叔2' ]
JavaScript
var tmp_4 = list_4.slice(1, -1);    // [1，-1)
console.log(list_4, tmp_4);
// [ 'sunan0', '苏南1', '-1sunan大叔2' ] [ '苏南1' ]
JavaScript
var tmp_4 = list_4.slice(1, 0);     // [] 第二个参数必须大于第一个
console.log(list_4, tmp_4);
// [ 'sunan0', '苏南1', '-1sunan大叔2' ] []
JavaScript
var tmp_4 = list_4.slice(1, 1);     // [] 第二个参数必须大于第一个
console.log(list_4, tmp_4);
// [ 'sunan0', '苏南1', '-1sunan大叔2' ] []
JavaScript
var tmp_4 = list_4.slice(1,2);      // [1,2)
console.log(list_4, tmp_4);
// [ 'sunan0', '苏南1', '-1sunan大叔2' ] [ '苏南1' ]
JavaScript
var tmp_4 = list_4.slice(1,3);      // [1,3)
console.log(list_4, tmp_4);
// [ 'sunan0', '苏南1', '-1sunan大叔2' ] [ '苏南1', '-1sunan大叔2' ]
JavaScript

参考文章：
https://newsn.net/say/js-slice.html

苏南大叔：如何理解js数组的splice函数？和slice函数有何区别？ - slice
如何理解js数组的splice函数？和slice函数有何区别？（图3-3）

相关链接

结束语

苏南大叔写的js相关文章，请点击：

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。

 【福利】 腾讯云最新爆款活动！1核2G云服务器首年50元！

 【源码】本文代码片段及相关软件，请点此获取更多信息

 【绝密】秘籍文章入口，仅传授于有缘之人   js