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 相关文章推荐
JavaScript在IE中“意外地调用了方法或属性访问”
Nov 19 Javascript
jquery.post用法关于type设置问题补充
Jan 03 Javascript
判断在css加载完毕后执行后续代码示例
Sep 03 Javascript
jQuery基础的工厂函数以及定时器的经典实例分析
May 20 Javascript
手机浏览器 后退按钮强制刷新页面方法总结
Oct 09 Javascript
js原生实现FastClick事件的实例
Nov 20 Javascript
bootstrap modal弹出框的垂直居中
Dec 14 Javascript
EditPlus中的正则表达式 实战(2)
Dec 15 Javascript
轻松学习Javascript闭包
Mar 01 Javascript
基于JS实现仿京东搜索栏随滑动透明度渐变效果
Jul 10 Javascript
Vue 2.0学习笔记之Vue中的computed属性
Oct 16 Javascript
详解React Native 屏幕适配(炒鸡简单的方法)
Jun 11 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
Terran热键控制
2020/03/14 星际争霸
php array_filter除去数组中的空字符元素
2020/06/21 PHP
php header函数的常用http头设置
2015/06/25 PHP
浅谈PHP中output_buffering
2015/07/13 PHP
laravel 执行迁移回滚示例
2019/10/23 PHP
PHP实现发送微博消息功能完整示例
2019/12/04 PHP
让广告代码不再影响你的网页加载速度
2006/07/07 Javascript
解析offsetHeight,clientHeight,scrollHeight之间的区别
2013/11/20 Javascript
微信小程序 安全包括(框架、功能模块、账户使用)详解
2017/01/16 Javascript
jQuery实现贪吃蛇小游戏(附源码下载)
2017/03/04 Javascript
67 个节约开发时间的前端开发者的工具、库和资源
2017/09/12 Javascript
vue2 router 动态传参,多个参数的实例
2017/11/10 Javascript
jQuery zTree 异步加载添加子节点重复问题
2017/11/29 jQuery
vue 利用路由守卫判断是否登录的方法
2018/09/29 Javascript
angularjs通过过滤器返回超链接的方法
2018/10/26 Javascript
基于javascript的拖拽类封装详解
2019/04/19 Javascript
史上最为详细的javascript继承(推荐)
2019/05/18 Javascript
node+multer实现图片上传的示例代码
2020/02/18 Javascript
vue 实现锚点功能操作
2020/08/10 Javascript
举例讲解Python设计模式编程中对抽象工厂模式的运用
2016/03/02 Python
使用python 和 lint 删除项目无用资源的方法
2017/12/20 Python
python斐波那契数列的计算方法
2018/09/27 Python
关于python下cv.waitKey无响应的原因及解决方法
2019/01/10 Python
window7下的python2.7版本和python3.5版本的opencv-python安装过程
2019/10/24 Python
使用pyqt5 tablewidget 单元格设置正则表达式
2019/12/13 Python
Python面向对象封装操作案例详解 II
2020/01/02 Python
Django用户身份验证完成示例代码
2020/04/03 Python
如何用python写个模板引擎
2021/01/14 Python
写给老师的表扬信
2014/01/21 职场文书
幼儿园消防安全制度
2014/01/26 职场文书
房屋转让协议书范本
2014/04/11 职场文书
物流专业专科生职业生涯规划书
2014/09/14 职场文书
单位租房协议书范本
2014/12/04 职场文书
Pytorch中的学习率衰减及其用法详解
2021/06/05 Python
十大公认最好看的动漫:《咒术回战》在榜,《钢之炼金术师》第一
2022/03/18 日漫
动画《朋友游戏》公开佐藤友生绘制的开播纪念绘
2022/04/06 日漫