Splice方法的图像化理解

splice在英语中的意思是拼接，在实际的代码使用中，splice就在数组中起到了一个拼接的作用

使用方法

splice(x,y,a,b,c,...)

其中x、y为数字，a、b、c为新添加的项，意思是从数组的第x项开始删除y项，并在其中添加a、b、c...，其中x、y必填，abc可不填

图像理解

现在让我们将splice方法想象成一把剪刀，splice(x,y,a,b,c,...)其中x表示剪刀落剪的位置，y表示剪去片段的长度，后面跟着的项则表示新插入的片段

或许这样表述还是有些抽象，但请接着往下看——

我们先声明一个数组

let array = [0,1,2,3,4]

它的内部结构如下——

删除

如果我们想要删除数组之中的array[1]和array[2]以及array[3]就可以用到以下代码——

array.splice(1,3)

它的意思是从第1项开始，连续删除3项

用图像理解就是剪刀在第一项落剪，开始剪去一个长度为3的片段

在剪去之后，将剩下的片段前后拼接，便有了新的数组——array=[0,4]

添加

如果我们想在指定位置添加几项，那么可以将y设置成0

array.splice(1,0,’新‘)

这样剪刀只会在对应位置剪开一个缺口，而不会剪去任何片段，之后我们将新片段插入并两端拼接，便有了下面这个新的数组——array=[0,'新',1,2,3,4]

综合使用

array.splice(2,1,9,'好')

对于这段代码我们分步骤来看它是如何执行的——

1. 从第二项落剪

2.剪去长度为1的片段

3. 移除剪去的片段并插入新片段

   

4. 拼接并得到新数组array=[0,1,9,'新',3,4]

   

总结

splice是非常好用的一个对数组修改的方法，可以同时实现添加、修改、删除，本文是笔者初学splice方法时的自我总结，如有遗漏或错误还请评论区斧正。