本篇文章只是列举一些常见的数组操作方法,并不全面,想要更详细的了解其他方法请移步官方手册,目前小菜鸡,以后想到的会慢慢再补充
1.添加数组元素
1.1 使用push()在数组末尾添加元素
let numbers = [0,1,2,3,4,5,6,7,8,9];
//使用push()在数组末尾添加元素
numbers.push(11);
numbers.push(12,13);
console.log(numbers);// [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 11, 12, 13]
1.2 使用unshift()在数组开头插入元素
let numbers = [0,1,2,3,4,5,6,7,8,9];
//使用unshift()在数组开头插入元素
numbers.unshift(-2);
numbers.unshift(-4,-3);
console.log(numbers);// [-4, -3, -2, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
2.删除元素
2.1 使用pop()从数组末尾删除元素
let numbers = [0,1,2,3,4,5,6,7,8,9];
numbers.pop();
console.log(numbers);// [0, 1, 2, 3, 4, 5, 6, 7, 8]
2.2 使用shift()删除数组的第一个元素
let numbers = [0,1,2,3,4,5,6,7,8,9];
numbers.shift();
console.log(numbers);// [1, 2, 3, 4, 5, 6, 7, 8, 9]
2.3 在任意位置添加或者删除元素
splice()
splice方法接收的第一个参数,表示想要删除或插入的元素的索引值。第二个参数是想要删除元素的个数(从索引值位置开始且包含索引值位置的元素),第三个参数往后就是想要添加的元素
let numbers = [0,1,2,3,4,5,6,7,8,9];
numbers.splice(4,2);
console.log(numbers);// [0, 1, 2, 3, 6, 7, 8, 9]
numbers.splice(4,2,4,5,6,7);
//会将6,7删除后再添加4,5,6,7
console.log(numbers);//[0,1,2,3,4,5,6,7,8,9]
delete 运算符
delete删除掉数组中的元素后,会把该下标出的值置为undefined,数组的长度不会变
let numbers = [0,1,2,3,4,5,6,7,8,9];
delete numbers[5];
console.log(numbers);// [0, 1, 2, 3, 4, empty, 6, 7, 8, 9]
console.log(numbers[5]);//undefined
2.4 concat()合并数组
concat方法可以向一个数组传递数组、对象或者是元素。数组会按照该方法传入的参数顺序连接指定数组。
const zero = 0;
const positiveNumbers = [1,2,3];
const negativeNumbers = [-3,-2,-1];
let numbers = negativeNumbers.concat(zero,positiveNumbers);
console.log(numbers);// [-3, -2, -1, 0, 1, 2, 3]
2.5 循环数组的一些常见方法
- for()方法,不作过多介绍
let numbers = [0,1,2,3,4,5,6,7,8,9];
for(let i=0; i<numbers.length; i++){
console.log(numbers[i]);
}
- forEach()
也是非常常见的,需要一个回调函数作为参数,回调函数的形参依次为,value:遍历的数组内容;index:对应的数组索引,array:数组本身。没有返回值
let numbers = [0,1,2,3,4,5,6,7,8,9];
numbers.forEach(function(value,index,array){
console.log(value);
console.log(index);
console.log(array);
//其它操作...
})
-
some()、every()方法
some方法和every的用法非常类似,提供一个回调函数,参数依次为处于当前循环的元素、该元素下标、数组本身,三者均可选。
数组的每一个元素都会执行回调函数,当返回值全部为true时,every方法会返回true,只要有一个为false,every方法返回false。some方法与之相反当有一个为true时,some方法返回true,当全部为false时,every方法返回false。
let numbers = [1,2,3,4,5,6,7,8,9];
let resevery = numbers.every(item =>{
return item % 2 === 0 ? true : false;
})
console.log(resevery);//false
let numbers = [1,2,3,4,5,6,7,8,9];
let ressome = numbers.some(item =>{
return item % 2 === 0 ? true : false;
})
console.log(ressome);//false
- map()和filter()方法
这两个方法会返回一个新的数组,map是映射的意思,即将数组元素做出相应的操作后再一一对应返回。filter()返回的新数组由使函数返回true的元素组成。
两个方法的使用非常相似,都是提供一个回调函数,参数依次为处于当前循环的元素、该元素下标、数组本身。
let data = [1, 2, 3, 4];
let arrayOfSquares = data.map(function (item) {
return item * item;
});
console.log(arrayOfSquares); // 1, 4, 9, 16
const numbers = [1,2,3,4,5,6,7,8,9,10,11,12,13,14];
const evenNumbers = numbers.filter(item =>{
return item % 2 === 0 ? true : false;
})
console.log(evenNumbers);//[2, 4, 6, 8, 10, 12, 14]
- reduce()方法
reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组。
callback (执行数组中每个值的函数,包含四个参数)
1、previousValue (上一次调用回调返回的值,或者是提供的初始值(initialValue))
2、currentValue (数组中当前被处理的元素)
3、index (当前元素在数组中的索引)
4、array (调用 reduce 的数组)
initialValue (作为第一次调用 callback 的第一个参数。)
例子:
var arr = [1, 2, 3, 4];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
})
console.log(arr, sum);
注意:如果没有提供initialValue,reduce 会从索引1的地方开始执行 callback 方法,跳过第一个索引。如果提供initialValue,从索引0开始。
当数组为空时,会报错
var arr = [];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
})
//报错,"TypeError: Reduce of empty array with no initial value"
但是要是我们设置了初始值就不会报错,如下:
var arr = [];
var sum = arr.reduce(function(prev, cur, index, arr) {
console.log(prev, cur, index);
return prev + cur;
},0)
console.log(arr, sum); // [] 0
后续想起再补充