JS中对数组元素进行增、删、改、查的方法,以及其他方法
总结一下 JS中提供的方法可以对数组元素进行增、删、改、查以及其他方法一、增加元素1、push()push可接收任意数量的参数,把它们逐个添加至数组末尾,并且可以返回修改后数组的长度。例子:var arr = [];var len = arr.push(1); //返回数组长度console.log(arr); // [1]console.log(len); /...
总结一下 JS中提供的方法可以对数组元素进行增、删、改、查以及其他方法
一、增加元素
1、push()
push可接收任意数量的参数,把它们逐个添加至数组末尾,并且可以返回修改后数组的长度。
例子:
var arr = [];
var len = arr.push(1); //返回数组长度
console.log(arr); // [1]
console.log(len); // 1
len = arr.push(2,3);
console.log(arr); // [1,2,3]
console.log(len); // 3
2、unshift()
该方法与push()类似,也可接收任意数量的参数,只不过是将参数逐个添加至数组前端而已,同样返回新数组长度。
例子:
var arr = [1,2,3];
var len = arr.unshift(0);
console.log(arr); // [0, 1, 2, 3]
console.log(len); // 4
len = arr.unshift(-2,-1);
console.log(arr); // [-2, -1, 0, 1, 2, 3]
console.log(len); // 6
3、concat()
该方法与push()方法有点类似,同样是将元素添加至数组末尾,只不过这个数组已经不是原来的那个数组了,而是其副本,所以concat()操作数组后会返回一个新的数组。
特性:
- 不传参数,返回当前数组副本
- 传递非数组参数,这些参数就会被直接添加到结果数组的末尾
- 传递数组参数,将数组每一个元素,添加新的数组中
例子:
var arr = [1,2,3];
var arr2 = arr.concat(4,[5,6]);
console.log(arr); // [ 1, 2, 3]
console.log(arr2); // [ 1, 2, 3, 4, 5, 6]
4、splice()
前面的三个方法都具有很大局限性,因为不是添加到数组前就是数组后,而splice()它非常灵活,它可以添加元素到数组的任意位置。
它除了可以添加元素之外还具有删除和替换元素的功能。
splice()可以向数组指定位置添加任意数量的元素。
需要传入至少3个参数:splice(a, b, c, d, ......)
1、a 起始元素的位置
2、b 要删除的元素个数,从起始元素开始算
3、c后面的是要插入的元素,可以是数组
var arr = [1,2,3];
arr.splice(2, 0, 6, 7, 8);
console.log(arr); //[1, 2, 6, 7, 8, 3]
arr.splice(2, 3, 10, 20, 30);
console.log(arr); //[1, 2, 10, 20, 30, 3]
arr.splice(2, 3, [40, 50, 60]);
console.log(arr); //[1, 2, [40, 50, 60], 3]
二、删除元素
1、pop()
与push()方法配合使用可以构成后进先出的栈,该方法可从数组末尾删除最后一项并返回该项。
例子:
var arr = [1,2,3];
var item = arr.pop();
console.log(item); // 3
console.log(arr); // [1, 2]
2、shift()
与push()方法配合使用可以构成先进先出的队列,该方法可删除数组第一项并返回该项。
例子:
var arr = [1,2,3,4,5];
var item = arr.shift();
console.log(item); // [1]
console.log(arr); // [2, 3, 4, 5]
3、slice()
该方法同concat()一样是返回一个新数组,不会影响原数组,只不过slice()是用来裁剪数组的,返回裁剪下来的数组。
slice()方法可以接受一或两个参数,
1、一个参数,返回从该参数指定位置开始到当前数组末尾的所有项。
2、两个参数,返回起始和结束位置之间的项,但不包括结束位置的项。
例子:
var arr = [1,2,3,4,5];
var arr3 = arr.slice(2);
console.log(arr); //[1, 2, 3, 4, 5]
console.log(arr3); //[3, 4, 5]
var arr2 = arr.slice(1, 3);
console.log(arr); //[1, 2, 3, 4, 5]
console.log(arr2); //[2, 3] 前包括后不包括
4、splice()
它除了可以添加元素之外还具有删除和替换元素的功能。
splice()可以向数组指定位置添加任意数量的元素。
需要传入至少3个参数:splice(a, b, c, d, ......)
1、a 起始元素的位置,从1开始;
2、b 要删除的元素个数,从起始元素开始算
3、c后面的是要插入的元素,可以是数组
var arr = [1,2,3];
arr.splice(2, 0, 6, 7, 8);
console.log(arr); //[1, 2, 6, 7, 8, 3]
arr.splice(2, 3, 10, 20, 30);
console.log(arr); //[1, 2, 10, 20, 30, 3]
arr.splice(2, 3, [40, 50, 60]);
console.log(arr); //[1, 2, [40, 50, 60], 3]
三、修改元素
使用splice() 修改数组元素。原理很简单,就是向指定位置插入任意数量的元素,且同时删除任意数量的元素。
例子:
var arr = [1,2,3,4,5];
arr.splice(2, 1, 10);
console.log(arr); //[1, 2, 10, 4, 5]
四、查找元素
indexOf() 和 lastIndexOf()
这两个方法都接收两个参数:
1、要查找的项
2、表示查找起点位置的索引。(可选的)
indexOf() 从数组的开头(位置0)开始向后查找。
lastIndexOf() 从数组的末尾开始向前查找。
两个方法,当找不到该元素时,都返回 -1
例如:
var arr = [1,2,3,4,5,2];
var index = arr.indexOf(2);
console.log(index); // 1
index = arr.indexOf(2, 0);
console.log(index); // 1
index = arr.indexOf(2, 2);
console.log(index); // 5
index = arr.indexOf(6);
console.log(index); // -1
其它方法:
1.join()
该方法用来将数组转换为字符串,不改变原数组,返回转换后的字符串
var arr = [1,2,3,4,5,2];
console.log(arr.join("-")); //1-2-3-4-5-2
console.log(arr); //[1,2,3,4,5,2]
2.sort()
按ascii码排序,改变原数组,返回排序后的数组
var arr = [1,2,3,4,5,2];
console.log(arr.sort()); //[1, 2, 2, 3, 4, 5]
console.log(arr); //[1, 2, 2, 3, 4, 5]
3.reverse()
用于颠倒数组中元素的顺序。返回的是颠倒后的数组,会改变原数组。、
var arr = [1,2,3,4,5,2];
console.log(arr.reverse()); // [2, 5, 4, 3, 2, 1]
console.log(arr); // [2, 5, 4, 3, 2, 1]
4.filter()
返回数组中满足条件的元素组成的新数组,原数组不变
var arr = [1,2,3,4,5,2];
var arr2 = arr.filter(function(current, index, array){
console.log("当前元素current="+current + "索引index="+index +"数组array="+array)
return current < 4
})
console.log(arr) //[1, 2, 3, 4, 5, 2]
console.log(arr2) //[1, 2, 3, 2]
5.map()
map() 方法来根据需求格式化原数组,返回格式化后的数组。原数组不变
var arr = [1,2,3,4,5,2];
var arr2 = arr.map(function(current, index, array){
console.log("当前元素current="+current + "索引index="+index +"数组array="+array)
return "$"+current
})
console.log(arr) //[1, 2, 3, 4, 5, 2]
console.log(arr2) //["$1", "$2", "$3", "$4", "$5", "$2"]
6.every()
对数组的每一项都运行给定的函数,若每一项都返回 ture,则返回 true
var arr = [1,2,3,4,5,2];
var bool = arr.every(function(current, index, array){
console.log("当前元素current="+current + "索引index="+index +"数组array="+array)
return current < 3
})
var bool2 = arr.every(function(current, index, array){
console.log("当前元素current="+current + "索引index="+index +"数组array="+array)
return current < 6
})
console.log(bool) //false
console.log(bool2) //true
7.some()
对数组的每一项都运行给定的函数,若存在一项或多项返回 ture,否则返回 false
var arr = [1,2,3,4,5,2];
var bool = arr.some(function(current, index, array){
console.log("当前元素current="+current + "索引index="+index +"数组array="+array)
return current < 3
})
var bool2 = arr.some(function(current, index, array){
console.log("当前元素current="+current + "索引index="+index +"数组array="+array)
return current < 0
})
console.log(bool) //true
console.log(bool2) //false
8.forEach()
遍历整个数组,不中断
var arr = [1,2,3,4,5,2];
var arr2 = [];
arr.forEach(function(item){
arr2.push(item)
})
console.log(arr2) //[1, 2, 3, 4, 5, 2]
console.log(arr) //[1, 2, 3, 4, 5, 2]
更多推荐
所有评论(0)