JS删除数组里的某个元素方法


Posted in Javascript onFebruary 03, 2018

删除数组指定的某个元素

js删除数组中某一项或几项的几种方法 https://3water.com/article/154737.htm

首先可以给JS的数组对象定义一个函数,用于查找指定的元素在数组中的位置,即索引,代码为:

Array.prototype.indexOf = function(val) { 
for (var i = 0; i < this.length; i++) { 
if (this[i] == val) return i; 
} 
return -1; 
};

然后使用通过得到这个元素的索引,使用js数组自己固有的函数去删除这个元素:

代码为:

Array.prototype.remove = function(val) { 
var index = this.indexOf(val); 
if (index > -1) { 
this.splice(index, 1); 
} 
};

这样就构造了这样一个函数,比如我有有一个数组:

var emp = ['abs','dsf','sdf','fd']

假如我们要删除其中的 'fd' ,就可以使用:

emp.remove('fd');

删除的数组的某一项

splice(index,len,[item]) 注释:该方法会改变原始数组。

splice有3个参数,它也可以用来替换/删除/添加数组内某一个或者几个值

index:数组开始下标 len: 替换/删除的长度 item:替换的值,删除操作的话 item为空

如:arr = ['a','b','c','d']

删除

//删除起始下标为1,长度为1的一个值(len设置1,如果为0,则数组不变) 
var arr = ['a','b','c','d']; 
arr.splice(1,1); 
console.log(arr); 
//['a','c','d']; 
 
 
//删除起始下标为1,长度为2的一个值(len设置2) 
var arr2 = ['a','b','c','d'] 
arr2.splice(1,2); 
console.log(arr2); 
//['a','d']

替换

//替换起始下标为1,长度为1的一个值为‘ttt',len设置的1 
var arr = ['a','b','c','d']; 
arr.splice(1,1,'ttt'); 
console.log(arr); 
//['a','ttt','c','d'] 
 
 
var arr2 = ['a','b','c','d']; 
arr2.splice(1,2,'ttt'); 
console.log(arr2); 
//['a','ttt','d'] 替换起始下标为1,长度为2的两个值为‘ttt',len设置的1

添加 ---- len设置为0,item为添加的值

var arr = ['a','b','c','d']; 
arr.splice(1,0,'ttt'); 
console.log(arr); 
//['a','ttt','b','c','d'] 表示在下标为1处添加一项'ttt'

delete方法删除掉数组中的元素后,会把该下标出的值置为undefined,数组的长度不会变

var arr = ['a','b','c','d']; 
delete arr[1]; 
arr; 
//["a", undefined × 1, "c", "d"] 中间出现两个逗号,数组长度不变,有一项为undefined

以上这篇JS删除数组里的某个元素方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
图片连续滚动代码[兼容IE/firefox]
Jun 11 Javascript
js中eval()函数和trim()去掉字符串左右空格应用
Feb 02 Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
Jan 23 Javascript
jQuery新的事件绑定机制on()示例应用
Jul 18 Javascript
在浏览器中打开或关闭JavaScript的方法
Jun 03 Javascript
JavaScript知识点总结(四)之逻辑OR运算符详解
May 31 Javascript
js实现select选择框效果及美化
Aug 19 Javascript
JavaScript正则表达式替换字符串中图片地址(img src)的方法
Jan 13 Javascript
微信小程序中换行空格(多个空格)写法详解
Jul 10 Javascript
Vue中使用的EventBus有生命周期
Jul 12 Javascript
kafka调试中遇到Connection to node -1 could not be established. Broker may not be available.
Sep 17 Javascript
ES6 async、await的基本使用方法示例
Jun 06 Javascript
jQuery niceScroll滚动条错位问题的解决方法
Feb 03 #jQuery
JS实现百度搜索接口及链接功能实例代码
Feb 02 #Javascript
原生JS实现的双色球功能示例
Feb 02 #Javascript
jQuery实现的下雪动画效果示例【附源码下载】
Feb 02 #jQuery
微信小程序实现列表下拉刷新上拉加载
Jul 29 #Javascript
微信小程序数字滚动插件使用详解
Feb 02 #Javascript
JS中的BOM应用
Feb 02 #Javascript
You might like
php生成年月日下载列表的方法
2015/04/24 PHP
php获取远程文件内容的函数
2015/11/02 PHP
javascript new一个对象的实质
2010/01/07 Javascript
jQuery 1.5 源码解读 面向中高阶JSER
2011/04/05 Javascript
js中将URL中的参数提取出来作为对象的实现代码
2011/08/16 Javascript
js 获取坐标 通过JS得到当前焦点(鼠标)的坐标属性
2013/01/04 Javascript
Bootstrap每天必学之标签与徽章
2015/11/27 Javascript
jquery zTree异步加载、模糊搜索简单实例分享
2016/03/24 Javascript
jQuery Mobile框架中的表单组件基础使用教程
2016/05/17 Javascript
BootStrap Table实现server分页序号连续显示功能(当前页从上一页的结束序号开始)
2017/09/12 Javascript
浅谈vue中改elementUI默认样式引发的static与assets的区别
2018/02/03 Javascript
如何用JS模拟实现数组的map方法
2020/07/30 Javascript
[01:11:21]DOTA2-DPC中国联赛 正赛 Phoenix vs CDEC BO3 第三场 3月7日
2021/03/11 DOTA
python开发之函数定义实例分析
2015/11/12 Python
python3利用tcp实现文件夹远程传输
2018/07/28 Python
python中退出多层循环的方法
2018/11/27 Python
Python实现操纵控制windows注册表的方法分析
2019/05/24 Python
PyCharm专业最新版2019.1安装步骤(含激活码)
2019/10/09 Python
pytorch 指定gpu训练与多gpu并行训练示例
2019/12/31 Python
python使用布隆过滤器的实现示例
2020/08/20 Python
彻底弄明白CSS3的Media Queries(跨平台设计)
2010/07/27 HTML / CSS
利用CSS3实现的文字定时向上滚动
2016/08/29 HTML / CSS
欧舒丹俄罗斯官方网站:L’OCCITANE俄罗斯
2019/11/22 全球购物
课程设计心得体会
2013/12/28 职场文书
五星级酒店餐饮部总监的标准岗位职责
2014/02/17 职场文书
医学生临床实习自我评价
2014/03/07 职场文书
先进事迹材料怎么写
2014/12/30 职场文书
小学少先队辅导员述职报告
2015/01/10 职场文书
2015年志愿者服务工作总结
2015/04/20 职场文书
一般纳税人申请报告
2015/05/18 职场文书
2015年酒店销售部工作总结
2015/07/24 职场文书
股东协议书范本2016
2016/03/21 职场文书
又涨知识了,自律到底多重要?
2019/06/27 职场文书
写给医护人员的一封感谢信
2019/09/16 职场文书
分享15个Webpack实用的插件!!!
2021/03/31 Javascript
修改并编译golang源码的操作步骤
2021/07/25 Golang