JS中splice添加或删除数组元素

更新时间：2023年12月28日 15:30:57 作者：布丁吖

本文主要介绍了JS中splice添加或删除数组元素,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

语法

array.splice(index,howmany,item1,…,itemX)

参数说明

参数	描述
index	必需。规定从何处添加/删除元素。该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
howmany	可选。规定应该删除多少元素。必须是数字，但可以是 “0”。如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
item1,…,itemX	可选。要添加到数组的新元素

返回值说明

Type	描述
Array	如果从arrayObject中删除了元素，则返回的是含有被删除的元素的数组。

下标问题

第一个参数index是数组的下标，因为index是整数，整数包括正数、负数和0，所以就需要理解清楚正数的时候下标是怎么排的，负数的时候下标是怎么排的，这样写代码的时候就不会迷糊了(不要问我为什么这么说😅)。

在网上没有找到相关资料说明splice的下标是怎么搞得，没办法那就只能自己研究了，功夫不负有心人，经过一番努力终于搞明白了😃。

下标排序方式如下：

在这里插入图片描述

实战

splice(index)

从index的位置开始，删除之后的所有元素(包括第index个)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(1);
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

有图有真相

在这里插入图片描述

splice(index,howmany)

删除从index位置开始的数，howmany为删除的个数，当howmany≤0时不会删除任何元素。

示例一(howmany＞0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(1, 2);
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

有图有真相：

在这里插入图片描述

示例二(howmany ≤ 0)

howmany≤0就是不删除howmany≤0就是不删除howmany≤0就是不删除

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(1, 0);
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

在这里插入图片描述

splice(index,howmany,item1,…,itemX)

howmany ≤ 0

howmany≤0就是不删除howmany≤0就是不删除howmany≤0就是不删除在index位置按顺序依次添加item1,…,itemX

示例一(index ≥ 0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(1, 0, 'Grape', 'Pear');
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

有图有真相

在这里插入图片描述

示例二(index＜0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(-1, 0, 'Grape', 'Pear');
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

有图有真相

在这里插入图片描述

howmany＞0

先从index位置(包含index)开始删除howmany个元素，然后在index位置按顺序依次添加item1,…,itemX

示例一(index ≥ 0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(1, 1, 'Grape', 'Pear');
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

有图有真相(蓝框标出的是添加的元素，橙框标出的是删除的元素)

在这里插入图片描述

示例二(index＜0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原数组：', array)
      let splice = array.splice(-2, 2, 'Grape', 'Pear');
      console.log('操作后数组：', array)
      console.log('变动内容', splice)

有图有真相(蓝框标出的是添加的元素，橙框标出的是删除的元素)

在这里插入图片描述

到此这篇关于JS中splice添加或删除数组元素的文章就介绍到这了,更多相关JS splice添加删除数组元素内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

您可能感兴趣的文章:

用javascrpt将指定网页保存为Excel的代码
这段代码在服务器中没有权限，可以保存在本地，存为htm文件，运行即可，就可以把文本内容存为excel文件了
2008-01-01
js实现的订阅发布者模式简单示例
这篇文章主要介绍了js实现的订阅发布者模式,结合完整示例形式分析了js订阅发布者模式相关实现与使用方法,需要的朋友可以参考下
2020-03-03
一个类似vbscript的round函数的javascript函数
同vbscript的Round函数功能相同，四舍五入保留指定小数位数
2009-04-04
JS实现类似51job上的地区选择效果示例
这篇文章主要介绍了JS实现类似51job上的地区选择效果,结合完整实例形式分析了javascript基于鼠标事件响应实现页面元素动态变换的相关操作技巧,需要的朋友可以参考下
2016-11-11
JavaScript之cookie技术详解
这篇文章主要为大家详细介绍了JavaScript之cookie技术,运用JS设置cookie、读取cookie、删除cookie ,需要的朋友可以参考下
2016-11-11
javascript中的replace函数(带注释demo)
在js中有两个replace函数一个是location.replace(url) 跳转到一个新的url.一个string.replace("xx","yy") 替换字符串返回一个新的字符串，该方法并不改变字符串本身。下面通过本文给大家介绍javascript中的replace函数
2018-01-01
如何在TypeScript中处理日期字符串
这篇文章主要介绍了如何在TypeScript中处理日期字符串，主要通过输入日期字符串来改善开发者的体验并减少潜在的错误，下文实现操作的分享需要的小伙伴可以参考一下
2022-04-04
JavaScript实现网页跨年倒计时
这篇文章主要为大家详细介绍了JavaScript实现网页跨年倒计时，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-12-12
js计算德州扑克牌面值的方法
这篇文章主要介绍了js计算德州扑克牌面值的方法,实例分析了javascript计算扑克面值的算法技巧,需要的朋友可以参考下
2015-03-03
如何写好你的JavaScript【推荐】
在实际工作中，我们应该经常会看到一些功能上没有问题，但编码风格和规范却十分糟糕的代码，这往往会让人不敢再往下阅读，甚至会影响阅读者一天的心情。本文的目的在于帮助那些没有养成良好的编码风格，缺乏相应编码规范意识的JavaScript学习者们改善他们的编码形象。
2017-03-03