JavaScript数组操作函数总结分享-猿码集

1. JavaScript中的数组介绍

在JavaScript中，数组是一种特殊的对象，可以保存多个值，这些值可以是任意类型的，包括数字、字符串、布尔值、函数、对象等等。数组的每个元素都有一个数字索引（键），数组的长度可以动态增长或缩小。

需要注意的是，虽然JavaScript中有Array类，但实际上JavaScript数组并不像传统的数组一样具有严格的类型和长度限制，而是可以动态扩展的对象。


let arr = [1, 'two', true];
arr.push({a: 1, b: 2});
console.log(arr.length); // 4

push()方法可以在数组的末尾添加一个或多个元素，返回值为新数组的长度；pop()方法可以删除数组的最后一个元素，并返回该元素的值。


let arr = [1, 2, 3];
arr.push(4, 5); // [1, 2, 3, 4, 5]
let lastElement = arr.pop(); // 5
console.log(lastElement); // [1, 2, 3, 4]

unshift()方法可以在数组的开头添加一个或多个元素，返回值为新数组的长度；shift()方法可以删除数组的第一个元素，并返回该元素的值。


let arr = [1, 2, 3];
arr.unshift(0); // [0, 1, 2, 3]
let firstElement = arr.shift(); // 0
console.log(firstElement); // [1, 2, 3]

slice()方法可以从数组中返回一个新的数组，并截取原数组的一部分。该方法接受两个参数，第一个参数为开始截取的位置，第二个参数为结束截取的位置（不包括该位置）。


let arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(1, 4); // [2, 3, 4]
console.log(newArr); // [1, 2, 3, 4, 5]

splice()方法可以删除数组中的一个或多个元素，并可以在指定位置添加一个或多个新元素。


let arr = [1, 2, 3, 4, 5];
arr.splice(1, 2, 'a', 'b', 'c'); // [2, 3]
console.log(arr); // [1, 'a', 'b', 'c', 4, 5]

concat()方法可以将两个或多个数组合并成一个新的数组。


let arr1 = [1, 2];
let arr2 = [3, 4];
let newArr = arr1.concat(arr2); // [1, 2, 3, 4]
console.log(newArr); // [1, 2]

reverse()方法可以翻转数组中元素的顺序。


let arr = [1, 2, 3, 4, 5];
arr.reverse(); // [5, 4, 3, 2, 1]
console.log(arr); // [5, 4, 3, 2, 1]

sort()方法可以对数组中的元素进行排序。


let arr = [3, 2, 1, 4, 5];
arr.sort(); // [1, 2, 3, 4, 5]
console.log(arr); // [1, 2, 3, 4, 5]

map()方法可以返回一个新的数组，由原数组中每个元素经过指定函数处理后的返回值组成。该方法接受一个回调函数作为参数，回调函数接受三个参数：当前元素、当前元素的索引、原数组本身。


let arr = [1, 2, 3];
let newArr = arr.map(function(item, index, array){
    return item * 2;
});
console.log(newArr); // [2, 4, 6]

filter()方法可以返回一个新的数组，该数组由满足指定条件的原数组元素组成。该方法接受一个回调函数作为参数，回调函数接受三个参数：当前元素、当前元素的索引、原数组本身。


let arr = [1, 2, 3, 4, 5];
let newArr = arr.filter(function(item, index, array){
    return item > 3;
});
console.log(newArr); // [4, 5]

forEach()方法可以对数组中的每个元素执行指定的函数。该方法接受一个回调函数作为参数，回调函数接受三个参数：当前元素的值、当前元素的索引、原数组本身。


let arr = [1, 2, 3];
arr.forEach(function(item, index, array){
    console.log(item);
});
// 1
// 2
// 3

reduce()方法可以从数组的第一个元素开始，逐个遍历到最后一个元素，并对每个元素执行指定的操作，最终返回一个累积的结果。该方法接受两个参数：一个回调函数和一个初始值。


let arr = [1, 2, 3];
let sum = arr.reduce(function(prev, curr, index, array){
    return prev + curr;
}, 0);
console.log(sum); // 6

JavaScript的数组操作函数非常强大，能够满足各种需求。当然，还有很多其他的数组操作函数，需要根据实际需求选择适合的方法。

需要注意的是，数组操作函数多数都会返回一个新的数组作为返回值，原数组不会被改变。如果需要改变原数组，需要使用对应的函数。