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 相关文章推荐
DOM精简教程
Oct 03 Javascript
jquery 最简单易用的表单验证插件
Feb 27 Javascript
20款效果非常棒的 jQuery 插件小结分享
Nov 18 Javascript
jquery使用经验小结
May 20 Javascript
javascript实现类似java中getClass()得到对象类名的方法
Jul 27 Javascript
javascript实现五星评分功能
Nov 10 Javascript
谈谈对JavaScript原生拖放的深入理解
Sep 20 Javascript
javascript判断firebug是否开启的方法
Nov 23 Javascript
原生js实现中奖信息无间隙滚动效果
Jan 18 Javascript
理解Proxy及使用Proxy实现vue数据双向绑定操作
Jul 18 Javascript
简单了解JavaScript作用域
Jul 31 Javascript
vue实现锚点定位功能
Jun 29 Vue.js
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数据库操作方法(MYSQL版)
2011/06/08 PHP
解析PHP中如何将数组变量写入文件
2013/06/06 PHP
PHP图片自动裁切应付不同尺寸的显示
2014/10/16 PHP
详解 PHP加密解密字符串函数附源码下载
2015/12/18 PHP
Nginx环境下PHP flush失效的解决方法
2016/10/19 PHP
JavaScript 空位补零实现代码
2010/02/26 Javascript
从零开始学习jQuery (二) 万能的选择器
2010/10/01 Javascript
用JS控制回车事件的代码
2011/02/20 Javascript
各浏览器中querySelector和querySelectorAll的实现差异分析
2012/05/23 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
2013/01/24 Javascript
js unicode 编码解析关于数据转换为中文的两种方法
2014/04/21 Javascript
jQuery动画特效实例教程
2014/08/29 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(二)
2015/12/10 Javascript
精通JavaScript的this关键字
2020/05/28 Javascript
jQuery 监控键盘一段时间没输入
2016/04/22 Javascript
JS基于面向对象实现的选项卡效果示例
2016/12/20 Javascript
angularjs2中父子组件的数据传递的实例代码
2017/07/05 Javascript
你应该知道的几类npm依赖包管理详解
2017/10/06 Javascript
Node.js上传文件功能之服务端如何获取文件上传进度
2018/02/05 Javascript
剖析Angular Component的源码示例
2018/03/23 Javascript
基于vue实现滚动条滚动到指定位置对应位置数字进行tween特效
2019/04/18 Javascript
适合前端Vue开发童鞋的跨平台Weex的使用详解
2019/10/16 Javascript
vue 使用鼠标滚动加载数据的例子
2019/10/31 Javascript
利用python代码写的12306订票代码
2015/12/20 Python
在Python文件中指定Python解释器的方法
2019/02/18 Python
解决阿里云邮件发送不能使用25端口问题
2020/08/07 Python
python如何操作mysql
2020/08/17 Python
世界上最大的糖果店:Dylan’s Candy Bar
2017/11/07 全球购物
Tod’s英国官方网站:意大利奢华手工制作手袋和鞋履
2019/03/15 全球购物
Holland & Barrett爱尔兰:英国领先的健康零售商
2019/03/31 全球购物
迟到检讨书800字
2014/01/13 职场文书
文化建设工作方案
2014/05/12 职场文书
财会专业大学生求职信
2014/09/26 职场文书
2015年行政部工作总结
2015/04/28 职场文书
运动员代表致辞
2015/07/29 职场文书
python3读取文件指定行的三种方法
2021/05/24 Python