JavaScript 数组添加或者删除元素

2018-11-1 01:45| 作者: admin| 查看: 155| 评论: 0|来自: 蚂蚁部落

本文介绍一下JavaScript如何添加或者删除数组中的元素。

删除和添加数组元素方式有多种,分别如下:

(1).数组首尾删除或者添加元素。

(2).在数组任意位置添加元素或者删除任意位置的元素。

一.添加数组元素:

(1).在数组元素结尾追加一个元素:

[JavaScript] 纯文本查看 复制代码运行代码
let arr=[1,2,3,4];
arr.push(5);
console.log(arr);

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/01/014559t5a88jaj05o50s01.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

成功在数组结尾追加数字5,更多内容参阅JavaScript push()一章节。

(2).在数组元素起始位置添加一个元素:

[JavaScript] 纯文本查看 复制代码运行代码
let arr=[1,2,3,4];
arr.unshift(0);
console.log(arr);

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/01/014646tz0yvevyz55z8t5v.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

成功在数组起始位置添加数字0,更多内容参阅JavaScript unshift()一章节。

(3).在任意位置插入元素:

[JavaScript] 纯文本查看 复制代码运行代码
let arr=[1,2,3,4];
Array.prototype.insert=function(index,item){
  this.splice(index,0,item);
}; 
arr.insert(2,10);
console.log(arr)

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/01/014742gefm3ttcafttn3zq.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

上述代码可以在数组索引位置2处插入数字10。代码分析如下:

(1).数组对象自身并没有insert方法,所以在构造函数Aarry原型之上自定义此方法。

(2).实现此功能的关键在于对splice的理解,简单的说,此方法可以从指定位置开始使用新元素替换指定数量数组元素,比如splice(index,0,item),就是从index位置开始,使用新元素item替换0个数组元素,也就是在index位置插入新元素。

相关阅读:

(1).关于splice方法具体用法参阅JavaScript splice()一章节。

(2).关于prototype具体用法参阅JavaScript prototype 原型一章节。

二.删除数组元素:

(1).删除数组结尾元素:

[JavaScript] 纯文本查看 复制代码运行代码
let arr=[1,2,3,4];
arr.pop();
console.log(arr);

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/01/014848coox8va8ezzx19zc.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

成功将数组最后一个元素删除,更多内容可以参阅JavaScript pop()一章节。

(2).删除数组起始元素:

[JavaScript] 纯文本查看 复制代码运行代码
let arr=[1,2,3,4];
arr.shift();
console.log(arr);

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/01/014954xpfzpced2ppdwffw.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

成功将数组第一个元素删除,更多内容可以参阅JavaScript shift()一章节。

(3).删除数组中任意元素:

[JavaScript] 纯文本查看 复制代码运行代码
let arr=[1,2,3,4];
Array.prototype.delete=function(index){
  this.splice(index,1);
}; 
arr.delete(2);
console.log(arr)

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/01/015041s98sgh7l12hdgs0g.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

上面代码可以删除索引为2的数组元素,也就是删除数组的第三个元素。

关键还是对splice方法的理解,这里不多介绍,具体参阅相关文章即可。


鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部