JavaScript中splice方法的使用「建议收藏」

全栈程序员站长

发布于 2022-10-05 09:21:21

1.7K0

发布于 2022-10-05 09:21:21

文章被收录于专栏：全栈程序员必看

大家好，又见面了，我是你们的朋友全栈君。

JavaScript中splice方法的使用

splice的基本用法

在JavaScript中，arrObject.splice()方法是处理数组的利器，利用它可以实现在指定位置删除、替换、插入指定数量的元素。其语法为： arrayObject.splice(index,howmany,item1,…,itemX) 含义为从index开始，删除howmanry个元素,并在原地插入item1, …, itemN，最后返回被删除的数组。

删除操作

let myArray=["html","css","javascript","jQuery"];
let myDel=myArray.splice(1,1);   //从索引1开始删除1个元素
console.log(myArray)      //['html','javascript','jQuery'];
console.log(myDel);   //['css']

插入操作

执行插入操作时，第二个参数howmanyt传入0即可。

let myArray=["html","css","javascript","jQuery"];
let myDel=myArray.splice(1,0,'html5','css3');   //从索引1开始,删除0个元素,然后插入'html5'和css3
console.log(myArray)      //['html','css','html5','css3','javascript','jQuery'];

替换操作

执行替换操作时，第二个参数howmary传入几，后面就添加几个元素，则为替换操作。

let myArray=["html","css","javascript","jQuery"];
let myDel=myArray.splice(0,2,'html5','css3');   //从索引1开始,删除2个元素,然后插入'html5'和css3
console.log(myArray)      //['html5','css3','javascript','jQuery'];

splice一次性删除多个元素

通过判断数组中的所有元素，删除满足特定条件的元素。大部人想到的是使用循环语句，再配合splice方法。但此操作存在一个问题，在循环数组体内使用array.splice()方法删除一个元素后，会导致循环数组的下标发生改变，从而该方法无效。

//案例：删除数组中值为1的无素
let myArray=[1,2,3,1,1,1,4,5,6];
for(let i=0;i<myArray.length;i++){
	if(myArray[i]==1){
		myArray.splice(i,1);
	}				
}
console.log(myArray)    //2,3,1,4,5,6，此答案错误

解决方法1：将数组改为倒着循环

let myArray=[1,2,3,1,1,1,4,5,6];
for(let i=myArray.length-1;i>=0;i--){
	if(myArray[i]==1){
		myArray.splice(i,1);
	}				
}
console.log(myArray)    //2,3,4,5,6

解决方法2：使用Array的filter()方法

let myArray=[1,2,3,1,1,1,4,5,6];
myArray=myArray.filter(item => item!=1);
console.log(myArray)    //2,3,4,5,6

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2022年9月13日，如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法

javascript

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

编程算法

javascript

登录后参与评论

0 条评论

热度