当前位置:首页 > 日记 > 正文

JavaScrip数组删除特定元素的几种方法总结

JavaScrip数组删除特定元素的几种方法总结

前言

可能一说到删除数组特定元素你估计不止一种方法可以实现,那么下面且来看看我总结的这几种方法,可能会对你有所帮助!话不多说了,来一起看看详细的介绍吧。

源数组

var arr = ["George", "John", "Thomas", "James", "Adrew", "Martin"];

伪删除

什么是伪删除呢? 就是说将数组元素值设置为null;

arr[ arr.indexOf( 'Thomas' ) ] = null;

删除后的数组是这个样子的:

["George", "John", null, "James", "Adrew", "Martin"]

不过要注意, 这意味着数组Array也就是变量arr的长度保持不变

完全删除

是什么是完全删除呢? 这个问题你可能从字面上也能想得到就是真正的删除数组Array的元素值, 并且会改变数组的长度, 可以通过内置数组对象Array的splice方法来实现这个需求!说到splice这个方法就要说一说它的具体参数了:

Array.prototype.splice = function(start,deleteCount,items) {};

上面是内置对象Array的splice方法原型定义, 中文意思呢是:剪接, 其参数的意义是:

  • start: 起点索引值
  • deleteCount: 要删除的元素个数
  • items: 删除后替换/追加的元素
    参数不加时就表示删除元素, 并且还要结合 deleteCount 的参数值
    如果 deleteCount 为 1, items 参数位置给一个参数值, 则表示替换
    如果 deleteCount 为 1, items 参数位置给多于一个的参数值, 则表示替换及追加元素

通过splice方法删除上面 伪删除 留下的元素值 null

arr.splice( arr.indexOf( null ), 1 );

删除后的数组是这个样子的:

["George", "John", "James", "Adrew", "Martin"]

既然说到了splice方法就顺便再说一下它的其它功能, 如 替换元素, 追加元素 等操作吧!

splice函数 - 替换元素

现在数组结构是这样的:

["George", "John", "James", "Adrew", "Martin"]

想要将数组元素 James 替换为 Tom

arr.splice( arr.indexOf( 'James' ), 1, 'Tom' );

替换后的数组结构是这个样子的:

["George", "John", "Tom", "Adrew", "Martin"]

splice函数 - 替换并追加元素

现在当前数组结构是这样的:

["George", "John", "Tom", "Adrew", "Martin"]

想要将数组元素 Tom 替换为 Judy 并追加 Linda 和 Alisa

arr.splice( arr.indexOf( 'Tom' ), 1, 'Judy', 'Linda', 'Alisa' );

替换及追加后的数组结构是这个样子的:

["George", "John", "Judy", "Linda", "Alisa", "Adrew", "Martin"]

splice函数 - 追加元素

追加元素你可以选择任意位置这取决于你的具体需求, 关键是在于 start 的取值索引位置而已!当前数组结构如下所示:

["George", "John", "Judy", "Linda", "Alisa", "Adrew", "Martin"]

比如说要在 Linda 和 Alisa 之间追加 Bill 和 Blake

arr.splice( arr.indexOf( 'Linda' ) + 1, 0, 'Bill', 'Blake' );

追加后的数组结构是下面这个样子的:

["George", "John", "Judy", "Linda", "Bill", "Blake", "Alisa", "Adrew", "Martin"]
  • 起点位置 arr.indexOf( 'Linda' ) + 1 就是在数组元素 Linda 之后了
  • 删除元素个数参数这里设置的是 0 这个是追加元素的关键, 也就是说不删除元素
  • 'Bill', 'Blake' 这个呢就是内置对象Array的splice方法的最后一个参数 items 它表示0个是和多个, 根据 deleteCount 参数值不同表示的含义也会不同, 这里 deleteCount 参数是 0 并且 items 又有两个值来表示这个参数, 所示说就是追加元素值 'Bill', 'Blake'

以上说的是删除数组中特定的元素, 那删除第一个元素和最后一个元素那实现在是太简单了, 这里简单提一下就是了

删除数组中第一个元素

arr.shift();

删除后的数组是这个样子的:

["John", "Judy", "Linda", "Bill", "Blake", "Alisa", "Adrew", "Martin"]

删除数组中最后一个元素

arr.pop();

删除后的数组是这个样子的:

["John", "Judy", "Linda", "Bill", "Blake", "Alisa", "Adrew"]

总结

以上就是JavaScrip数组删除特定元素个人所总结的一些方法,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果您还要其它的一些好的方法, 或有疑问大家可以留言交流,谢谢大家对的支持。

相关文章

js禁止浏览器页面后退功能的实例 |

js禁止浏览器页面后退功能的实例 |

推荐,浏览器,实例,页面,功能,实例如下所示:<script> $(function(){ if(window.location.href.indexOf("/login") > -1) { //防止页面后退 history.pushState(null, null, document.URL); window.addEventListener('popstate…

excel2013怎么将二维表转换成一维

excel2013怎么将二维表转换成一维

二维,步骤,转换成,电脑软件,表二,  在做数据处理的时候,有的时候为了处理方便我们需要将二维的数据表处理成一维的数据表,excel2013表格要怎么将二维表转换成一维表呢?下面小编整理了excel2013将二维表转换成一维表的步骤,希望对你有帮助!exce…

Node.JS中快速扫描端口并发现局域

Node.JS中快速扫描端口并发现局域

地址,服务器,发现,扫描,端口,在 Node.JS 中进行端口扫描还是比较方便的,一般会有广播和轮询两种方式。即使用广播和扫描,使用广播发出的消息有时会被路由器屏蔽,所以并不可靠。使用node.js中的net模块,可以直接尝试向目录主机的某个端口进行连…

ppt2010怎么去除超链接下划线

ppt2010怎么去除超链接下划线

下划线,超链接,电脑软件,  做PPT时,为了让PPT更加的美观,有超链接时,带有下划线的超链接会影响美观,那么要去掉下划线就会更好看,那么怎么去掉下划线呢?下面下编教你一个最方便,简单的方法吧。ppt2010去除超链接下划线的步骤:  找到要设置无下…

把字体嵌入到ppt的方法步骤

把字体嵌入到ppt的方法步骤

方法,字体,步骤,电脑软件,strong,  当你原本设计好的整个ppt,包括各个字体的格式和排版时,放别人电脑上打开时,所有字体效果都消失了,变成了系统默认的字体,也影响了整个ppt的美观,这时改怎么办呢?下面小编就教你怎么把字体嵌入ppt,希望对你有帮…

word2013如何打开word左侧目录

word2013如何打开word左侧目录

目录,电脑软件,word,  在word左侧显示目录,这样可以大大提高阅读word文档的速度。但是有时候word是没有显示左侧目录或者被不小心关闭了,那么怎样才能打开word左侧目录呢?打开word左侧目录的步骤如下:  步骤一:打开word文档。可以是空白的…

PPT中怎么制作双箭头

PPT中怎么制作双箭头

双箭,电脑软件,PPT,  箭头大家经常见到吧,那大家想想在过马路时,路标的指示方向是什么呢?大家在PPT中如何制作组合的双箭头,拭目以待吧。以下是小编为您带来的关于制作双箭头,希望对您有所帮助。PPT制作双箭头1、点击插入-插图-形状-右箭头,按…

JavaScript获取ul中li个数的方法

JavaScript获取ul中li个数的方法

方法,个数,电脑软件,JavaScript,ul,本文实例讲述了JavaScript获取ul中li个数的方法。分享给大家供大家参考,具体如下:有这样一段HTML代码:<ul id="mycarousel"> <li><img src=01_MED.jpg height=80 width=100/></li> <li><img src=02_…

jQuery中layer分页器的使用

jQuery中layer分页器的使用

分页,电脑软件,jQuery,layer,layui给我们提供了分页器的组件,进行简单的配置就能做出分页的效果上代码:// 点击查询按钮 开始显示表格内容// 如果查询内容不存在 则显示为空$('#searchBtn').click(function(){ var html = ''; $.ajax({…

Excel中进行设置顶端标题行的操作

Excel中进行设置顶端标题行的操作

设置,操作方法,标题,操作步骤,电脑软件,  在excel录入较多的数据时,我们希望每一页都有标题行,这样就可以清楚的知道我们所要表达的意思了。今天,小编就教大家在Excel中进行设置顶端标题行的操作方法。Excel中进行设置顶端标题行的操作步骤…

帮助QQ好友申诉发现自己没有开通邮

帮助QQ好友申诉发现自己没有开通邮

开通,发现自己,邮箱,好友,电脑软件,  帮助QQ好友申诉发现自己没有开通邮箱该怎么办?好友的qq丢了,于是找我来找回qq,但是悲催的是,我的qq邮箱没有开,该怎么帮助他申请呢?下面跟着小编一起来看看吧,欢迎大家前来阅读!帮助QQ好友申诉发现自己没…

Excel如何用数组公式提取区域中的

Excel如何用数组公式提取区域中的

区域,数组,公式,如何用,电脑软件,  有时需要要提取多行多列区域中的重复数据到某列,用数组公式提取区域中的重复值。以下是小编为您带来的关于Excel用数组公式提取区域中的重复值,希望对您有所帮助。Excel用数组公式提取区域中的重复值如下…