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 相关文章推荐
使用documentElement正确取得当前可见区域的大小
Jul 25 Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
Dec 16 Javascript
谈谈encodeURI和encodeURIComponent以及escape的区别与应用
Nov 24 Javascript
jQuery实例—选项卡的简单实现(js源码和jQuery)
Jun 14 Javascript
jquery插件格式实例分析
Jun 16 Javascript
原生JS实现图片轮播切换效果
Dec 15 Javascript
jQuery监听浏览器窗口大小的变化实例
Feb 07 Javascript
基于vue中css预加载使用sass的配置方式详解
Mar 13 Javascript
Vue2.0 实现移动端图片上传功能
May 30 Javascript
vue监听input标签的value值方法
Aug 27 Javascript
vue axios重复点击取消上一次请求封装的方法
Jun 19 Javascript
原生JavaScript实现轮播图
Jan 10 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
编写漂亮的代码 - 将后台程序与前端程序分开
2008/04/23 PHP
建站常用13种PHP开源CMS比较
2009/08/23 PHP
解析PHP将对象转换成数组的方法(兼容多维数组类型)
2013/06/21 PHP
php中用date函数获取当前时间有误的解决办法
2013/08/02 PHP
codeigniter使用技巧批量插入数据实例方法分享
2013/12/31 PHP
thinkphp实现分页显示功能
2016/12/03 PHP
laravel 时间格式转时间戳的例子
2019/10/11 PHP
JQuery浮动DIV提示信息并自动隐藏的代码
2010/08/29 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
2013/07/04 Javascript
使用VS开发 Node.js指南
2015/01/06 Javascript
微信内置浏览器私有接口WeixinJSBridge介绍
2015/05/25 Javascript
JavaScript实现身份证验证代码
2016/02/17 Javascript
基于node实现websocket协议
2016/04/25 Javascript
详解用函数式编程对JavaScript进行断舍离
2017/09/18 Javascript
用Axios Element实现全局的请求loading的方法
2018/03/15 Javascript
Javascript实现时间倒计时功能
2018/11/17 Javascript
使用vue完成微信公众号网页小记(推荐)
2019/04/28 Javascript
详解vue 图片上传功能
2019/04/30 Javascript
Vue循环遍历选项赋值到对应控件的实现方法
2020/06/22 Javascript
全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
2020/09/08 Javascript
[00:34]DOTA2上海特级锦标赛 Spirit战队宣传片
2016/03/04 DOTA
python实现网页链接提取的方法分享
2014/02/25 Python
Python基础入门之seed()方法的使用
2015/05/15 Python
Python中max函数用法实例分析
2015/07/17 Python
Python 正则表达式入门(中级篇)
2016/12/07 Python
python executemany的使用及注意事项
2017/03/13 Python
python3 selenium 切换窗口的几种方法小结
2018/05/21 Python
python取均匀不重复的随机数方式
2019/11/27 Python
Python3 利用face_recognition实现人脸识别的方法
2020/03/13 Python
python对指定字符串逆序的6种方法(小结)
2020/04/02 Python
python和js交互调用的方法
2020/06/23 Python
灵活运用CSS3特性绘制简易版围棋效果
2016/09/28 HTML / CSS
辞职信的写法
2015/02/27 职场文书
校长一岗双责责任书
2015/05/09 职场文书
python自然语言处理之字典树知识总结
2021/04/25 Python
MySQL安装失败的原因及解决步骤
2022/06/14 MySQL