扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章给大家分享的是有关javascript如何移除数组元素的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
创新互联是一家成都网站制作、网站设计、外贸网站建设,提供网页设计,网站设计,网站制作,建网站,按需求定制开发,网站开发公司,于2013年成立是互联行业建设者,服务者。以提升客户品牌价值为核心业务,全程参与项目的网站策划设计制作,前端开发,后台程序制作以及后期项目运营并提出专业建议和思路。
javascript是一种动态类型、弱类型的语言,基于对象和事件驱动并具有相对安全性并广泛用于客户端网页开发的脚本语言,同时也是一种广泛用于客户端Web开发的脚本语言。它主要用来给HTML网页添加动态功能,现在JavaScript也可被用于网络服务器,如Node.js。
javascript移除数组元素的方法:1、通过length属性移除数组元素;2、通过delete关键字移除;3、通过栈方法移除;4、通过队列方法移除;5、通过操作方法移除;6、通过迭代方法移除;7、通过原型方法移除。
本文操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。
JavaScript中数组元素删除的七大方法汇总
在JavaScript中,除了Object之外,Array类型恐怕就是最常用的类型了。与其他语言的数组有着很大的区别,JavaScript中的Array非常灵活。今天我就来总结了一下JavaScript中Array删除的方法。大致的分类可以分为如下几类:
1、length
2、delete
3、栈方法
4、队列方法
5、操作方法
6、迭代方法
7、原型方法
下面我对上面说的方法做一一的举例和解释。
一、length
JavaScript中Array的length属性非常有特点一一它不是只读的。因此,通过设置这个属性可以从数组的末尾移除项或添加新项,请看下面例子:
var colors = ["red", "blue", "grey"]; //创建一个包含3个字符串的数组colors.length = 2; console.log(colors[2]); //undefined
二、delete关键字
var arr = [1, 2, 3, 4];delete arr[0];console.log(arr); //[undefined, 2, 3, 4]
可以看出来,delete删除之后数组长度不变,只是被删除元素被置为undefined了。
三、栈方法
var colors = ["red", "blue", "grey"]; var item = colors.pop(); console.log(item); //"grey"console.log(colors.length); //2
可以看出,在调用Pop方法时,数组返回最后一项,即”grey”,数组的元素也仅剩两项。
四、队列方法
队列数据结构的访问规则是FIFO(先进先出),队列在列表的末端添加项,从列表的前端移除项,使用shift方法,它能够移除数组中的第一个项并返回该项,并且数组的长度减1。
var colors = ["red", "blue", "grey"]; var item = colors.shift(); console.log(item); //"red"console.log(colors.length); //2
五、操作方法
splice()恐怕要算最强大的数组方法了,他的用法有很多种,在此只介绍删除数组元素的方法。在删除数组元素的时候,它可以删除任意数量的项,只需要指定2个参数:要删除的第一项的位置和要删除的项数,例如splice(0, 2)会删除数组中的前两项。
var colors = ["red", "blue", "grey"];var item = colors.splice(0, 1);console.log(item); //"red"console.log(colors); //["blue", "grey"]
六、迭代方法
所谓的迭代方法就是用循环迭代数组元素发现符合要删除的项则删除,用的最多的地方可能是数组中的元素为对象的时候,根据对象的属性例如ID等等来删除数组元素。下面介绍两种方法:
第一种用最常见的ForEach循环来对比元素找到之后将其删除:
var colors = ["red", "blue", "grey"]; colors.forEach(function(item, index, arr) { if(item == "red") { arr.splice(index, 1); } });
第二种我们用循环中的filter方法:
var colors = ["red", "blue", "grey"]; colors = colors.filter(function(item) { return item != "red"}); console.log(colors); //["blue", "grey"]
代码很简单,找出元素不是”red”的项数返回给colors(其实是得到了一个新的数组),从而达到删除的作用。
七、原型方法
通过在Array的原型上添加方法来达到删除的目的:
Array.prototype.remove = function(dx) { if(isNaN(dx) || dx > this.length){ return false; } for(var i = 0,n = 0;i < this.length; i++) { if(this[i] != this[dx]) { this[n++] = this[i]; } } this.length -= 1; };var colors = ["red", "blue", "grey"]; colors.remove(1); console.log(colors); //["red", "grey"]
在此把删除方法添加给了Array的原型对象,则在此环境中的所有Array对象都可以使用该方法。尽管可以这么做,但是我们不推荐在产品化的程序中来修改原生对象的原型。道理很简单,如果因某个实现中缺少某个方法,就在原生对象的原型中添加这个方法,那么当在另一个支持该方法的实现中运行代码时,就可能导致命名冲突。而且这样做可能会意外的导致重写原生方法。
感谢各位的阅读!关于“javascript如何移除数组元素”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流