ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

【js知识】splice()实现数组的添加、删除、替换

2021-01-13 14:03:40  阅读:188  来源: 互联网

标签:console splice removes js numbers 数组 const log


splice 方法一个数组中最强大的方法,不仅可以对数组进行元素对添加,对数组元素对删除,对数组元素的替换,可以说它集百家与一身,它会直接修改原数组,返回删除的元素。

那么我们就来好好的看看它是如何进行数组的添加、删除与替换工作。

splice 方法的参数传入数量不的不同形成的效果也会不同。

首先它接受三个参数或甚至更多,除了开始位置索引 start 参数以外,其余全是可选参数。

//语法
array.splice(start, count, item1, item2, ...)

start:删除数组元素的开始索引(必须)
count:需要删除元素的个数
item1,item2…:插入数组的元素

一、删除数组

传递一个参数的时候,数组会删除从给定的索引到数组结束的所有元素,原数组会被修改,返回删除的数组

//删除元素
const numbers = [1, 2, 3, 4, 5];
const removes = numbers.splice(2);
console.log(numbers); //[1, 2]
console.log(removes); //[3, 4, 5]

如何删除指定个数的数组?如我们只想删除第6个元素等等…
我们添加第二个参数 count 即可,元素的索引是从0开始,也就是说 start 参数是从 0 开始的。

//删除第6个元素
const numbers = [1, 2, 3, 4, 5, 6, 7, 8];
const removes = numbers.splice(5, 1);
console.log(numbers); //[1, 2, 3, 4, 5, 7, 8]
console.log(removes); //[6]

//删除第6,7位两个元素
const numbers = [1, 2, 3, 4, 5, 6, 7, 8];
const removes = numbers.splice(5, 2);
console.log(numbers); //[1, 2, 3, 4, 5, 8]
console.log(removes); //[6, 7]

二、添加数组

如何添加一个元素,这会就要用到我们的第三个参数或者第四个,第五个等等,依次添加即可。

//指定在某个位置添加一个元素
const numbers = [1, 2, 3, 4, 5];
const removes = numbers.splice(2, 0, 'F');
console.log(numbers); //[1, 2, "F", 3, 4, 5]
console.log(removes); //[]

//指定在某个位置添加多个元素
const numbers = [1, 2, 3, 4, 5];
const removes = numbers.splice(2, 0, 'A', 'B', 'C');
console.log(numbers); //[1, 2, "A", "B", "C", 3, 4, 5]
console.log(removes); //[]

因为不对数组进行任何的删除项,然后又在数组中插入一些元素,实现的数组的添加

三、替换数组元素

替换的思路与删除仅仅多了一步把要插入掉位置元素给删除掉。

//替换第2,3位的元素
const numbers = [1, 2, 3, 4, 5];
const removes = numbers.splice(2, 2, 'A', 'B');
console.log(numbers); //[1, 2, "A", "B", 5]

console.log(removes); //[3, 4]

原文:https://www.cnblogs.com/beevesnoodles/p/9667303.html

标签:console,splice,removes,js,numbers,数组,const,log
来源: https://www.cnblogs.com/hellocd/p/14271648.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有