javascript 删除数组元素和清空数组的简单方法


Posted in Javascript onFebruary 24, 2017

javascript 删除数组元素和清空数组的简单方法

一、清空数组

var ary = [1,2,3,4]; 
ary.splice(0,ary.length);//清空数组 
console.log(ary); // 输出 [],空数组,即被清空了

二、删除数组元素

var ary = [1,2,3,4]; 
ary.splice(0,1);
或 ary.splice($.inArray(2, ary), 1); 其中$.inArray(2, ary)用来查找某元素在数组中的索引位置。

三,js 删除数组几种方法

var arr=[‘a','b','c'];

若要删除其中的'b',有两种方法:

**1,**delete方法:delete arr[1]

这种方式数组长度不变,此时arr[1]变为undefined了,但是也有好处原来数组的索引也保持不变,此时要遍历数组元素可以才用

for(index in arr)
{
 document.write('arr['+index+']='+arr[index]);
}

这种遍历方式跳过其中undefined的元素

* 该方式IE4.o以后都支持了

2,数组对象splice方法:arr.splice(1,1);

这种方式数组长度相应改变,但是原来的数组索引也相应改变

splice参数中第一个1,是删除的起始索引(从0算起),在此是数组第二个元素

第二个1,是删除元素的个数,在此只删除一个元素,即'b';

此时遍历数组元素可以用普通遍历数组的方式,比如for,因为删除的元素在

数组中并不保留

该方法IE5.5以后才支持
值得一提的是splice方法在删除数组元素的同时,还可以新增入数组元素

比如arr.splice(1,1,'d','e'),d,e两个元素就被加入数组arr了

结果数组变成arr:'a','d','e','c' 

另外,JavaScript通过设置数组的length属性来截断数组,是惟一一种缩短数组长度的方法。

如果使用delete运算符来删除数组中元素,虽然那个元素变成未定义的,但是数组的length属性并不改变两种删除元素,数组长度也改变的方法。

/*
  * 方法:Array.remove(dx)
  * 功能:删除数组元素.
  * 参数:dx删除元素的下标.
  * 返回:在原数组上修改数组
*/
//经常用的是通过遍历,重构数组.
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
 }
 a = ['1','2','3','4','5'];
 alert("elements: "+a+"nLength: "+a.length);
 a.remove(0); //删除下标为0的元素
 alert("elements: "+a+"nLength: "+a.length);
/*
  * 方法:Array.baoremove(dx)
  * 功能:删除数组元素.
  * 参数:dx删除元素的下标.
  * 返回:在原数组上修改数组.
  */
 //也可以用splice来实现.
 Array.prototype.baoremove = function(dx)
 { // 3water.com
if(isNaN(dx)||dx>this.length){return false;}
this.splice(dx,1);
 }
 b = ['1','2','3','4','5'];
 alert("elements: "+b+"nLength: "+b.length);
 b.baoremove(1); //删除下标为1的元素
 alert("elements: "+b+"nLength: "+b.length);

在IE5或更低的版本中,JavaScript的Array(数组)对象并未提供现成的删除数组元素的方法。在IE5.5+的版本中,虽然有splice方法,但是并不是删除某一项(或几项),而仅仅是将某一项(或几项)的值清除,也就是说该项仍然存在,数组的长度并没有改变。

事实上,可以自己为数组增加一个删除方法(注意,这里指的是将数组的某一项真正的从数组成员中移除)。或许,会想到用循环来为数组重新赋值,这样做当然可以,但效率很低。

以下介绍利用Array对象的两个方法slice、concat来自定义删除数组的方法。

Array.prototype.del=function(n) { //n表示第几项,从0开始算起。
//prototype为对象原型,注意这里为对象增加自定义方法的方法。
 if(n<0) //如果n<0,则不进行任何操作。
return this;
 else
return this.slice(0,n).concat(this.slice(n+1,this.length));
/*
 concat方法:返回一个新数组,这个新数组是由两个或更多数组组合而成的。
 这里就是返回this.slice(0,n)/this.slice(n+1,this.length)
 组成的新数组,这中间,刚好少了第n项。
 slice方法: 返回一个数组的一段,两个参数,分别指定开始和结束的位置。
*/
}
//自己增加的方法
var test=new Array(0,1,2,3,4,5);
test=test.del(3); //从0算起,删除第4项。
alert(test);

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jquery选择器需要注意的问题
Nov 26 Javascript
jQuery中closest和parents的区别分析
May 07 Javascript
深入浅析JavaScript中with语句的理解
May 12 Javascript
javascript类型系统——undefined和null全面了解
Jul 13 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
Aug 31 Javascript
浅谈使用splice函数对数组中的元素进行删除时的注意事项
Dec 04 Javascript
js 客户端打印html 并且去掉页眉、页脚的实例
Nov 03 Javascript
vue通过路由实现页面刷新的方法
Jan 25 Javascript
如何用webpack4带你实现一个vue的打包的项目
Jun 20 Javascript
layui监听下拉选框选中值变化的方法(包含监听普通下拉选框)
Sep 24 Javascript
JS实现动态无缝轮播
Jan 11 Javascript
js实现贪吃蛇小游戏(加墙)
Jul 31 Javascript
JavaScript基本类型值-Number类型
Feb 24 #Javascript
AngularJS Toaster使用详解
Feb 24 #Javascript
js获取隐藏元素的宽高
Feb 24 #Javascript
js css自定义分页效果
Feb 24 #Javascript
jQuery快速高效制作网页交互特效
Feb 24 #Javascript
Angular.js自定义指令学习笔记实例
Feb 24 #Javascript
利用原生JS与jQuery实现数字线性变化的动画
Feb 24 #Javascript
You might like
php实现图片上传、剪切功能
2016/05/07 PHP
[原创]php实现数组按拼音顺序排序的方法
2017/05/03 PHP
js函数般调用正则
2008/04/08 Javascript
AJAX的跨域与JSONP(为文章自动添加短址的功能)
2010/01/17 Javascript
7款风格新颖的jQuery/CSS3菜单导航分享
2013/04/23 Javascript
html向js方法传递参数具体实现
2013/08/08 Javascript
JS获取时间的方法
2015/01/21 Javascript
一道关于JavaScript变量作用域的面试题
2016/03/08 Javascript
Angularjs---项目搭建图文教程
2016/07/08 Javascript
Javascript中引用类型传递的知识点小结
2017/03/06 Javascript
bootstrap常用组件之头部导航实现代码
2017/04/20 Javascript
React Native 自定义下拉刷新上拉加载的列表的示例
2018/03/01 Javascript
Node.js中,在cmd界面,进入退出Node.js运行环境的方法
2018/05/12 Javascript
解决Layui数据表格中checkbox位置不居中的方法
2018/08/15 Javascript
Vue.js实现开发购物车功能的方法详解
2019/02/22 Javascript
详解Vue中的scoped及穿透方法
2019/04/18 Javascript
vue.js表单验证插件(vee-validate)的使用教程详解
2019/05/23 Javascript
基于JavaScript伪随机正态分布代码实例
2019/11/07 Javascript
JavaScript事件冒泡机制原理实例解析
2020/01/14 Javascript
[03:38]TI4西雅图DOTA2前线报道 71专访
2014/07/08 DOTA
Python性能优化的20条建议
2014/10/25 Python
python实现字符串和日期相互转换的方法
2015/05/13 Python
Python匿名函数及应用示例
2019/04/09 Python
pyqt5中QThread在使用时出现重复emit的实例
2019/06/21 Python
python实现批量nii文件转换为png图像
2019/07/18 Python
Numpy的简单用法小结
2019/08/28 Python
Python3+SQLAlchemy+Sqlite3实现ORM教程
2021/02/16 Python
李维斯德国官方网上商店:Levi’s德国
2016/09/10 全球购物
英国户外装备商店:Ultimate Outdoors
2019/05/07 全球购物
Shopee菲律宾:在线购买和出售
2019/11/25 全球购物
生物化学研究助理员求职信
2013/10/09 职场文书
大学生的应聘自我评价
2013/12/13 职场文书
学困生帮扶工作总结
2015/08/13 职场文书
月考总结与反思
2015/10/22 职场文书
原生CSS实现文字无限轮播的通用方法
2021/03/30 HTML / CSS
Python可视化动图组件ipyvizzu绘制惊艳的可视化动图
2022/04/21 Python