JavaScript 中的数组(Array)提供了一系列非常实用的方法来帮助你操作数组。下面我将详细介绍一些常用的数组方法,并给出对应的代码示例。
1. Array.from()
用途:从类数组对象或可迭代对象创建一个新的数组实例。
示例:
const arrayLike = { length: 3, 0: 'a', 1: 'b', 2: 'c' };
const arr = Array.from(arrayLike);
console.log(arr); // 输出: ['a', 'b', 'c']
2. Array.of()
用途:从零个或多个项创建一个新的数组实例。
示例:
const arr = Array.of(1, 2, 3, 4);
console.log(arr); // 输出: [1, 2, 3, 4]
3. push()
用途:向数组的末尾添加一个或多个元素,并返回新的长度。
示例:
let arr = [1, 2, 3];
arr.push(4, 5);
console.log(arr); // 输出: [1, 2, 3, 4, 5]
4. pop()
用途:删除并返回数组的最后一个元素。
示例:
let arr = [1, 2, 3];
let lastElement = arr.pop();
console.log(lastElement); // 输出: 3
console.log(arr); // 输出: [1, 2]
5. shift()
用途:删除并返回数组的第一个元素。
示例:
let arr = [1, 2, 3];
let firstElement = arr.shift();
console.log(firstElement); // 输出: 1
console.log(arr); // 输出: [2, 3]
6. unshift()
用途:向数组的开头添加一个或多个元素,并返回新的长度。
示例:
let arr = [1, 2, 3];
arr.unshift(0, -1);
console.log(arr); // 输出: [-1, 0, 1, 2, 3]
7. slice()
用途:返回一个新的数组,包含从 start 到 end 的所有元素的浅拷贝。
示例:
let arr = [1, 2, 3, 4, 5];
let slicedArr = arr.slice(1, 3);
console.log(slicedArr); // 输出: [2, 3]
8. splice()
用途:删除/替换数组的一部分,并返回被删除的元素。也可以用于添加新元素。
示例:
let arr = [1, 2, 3, 4, 5];
let removedElements = arr.splice(1, 2, 'a', 'b');
console.log(removedElements); // 输出: [2, 3]
console.log(arr); // 输出: [1, 'a', 'b', 4, 5]
9. concat()
用途:返回一个新数组,其中包含当前数组的所有元素,后面跟着提供的数组的元素。
示例:
let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let concatenatedArr = arr1.concat(arr2);
console.log(concatenatedArr); // 输出: [1, 2, 3, 4, 5, 6]
10. join()
用途:将数组的所有元素连接成一个字符串,并返回这个字符串。
示例:
let arr = [1, 2, 3];
let str = arr.join('-');
console.log(str); // 输出: '1-2-3'
11. toString()
用途:将数组转换为逗号分隔的字符串。
示例:
let arr = [1, 2, 3];
let str = arr.toString();
console.log(str); // 输出: '1,2,3'
12. sort()
用途:对数组的元素进行排序,并返回该数组。
示例:
let arr = [3, 1, 4, 1, 5, 9, 2];
arr.sort((a, b) => a - b);
console.log(arr); // 输出: [1, 1, 2, 3, 4, 5, 9]
13. reverse()
用途:颠倒数组中元素的顺序,并返回该数组。
示例:
let arr = [1, 2, 3, 4, 5];
arr.reverse();
console.log(arr); // 输出: [5, 4, 3, 2, 1]
14. indexOf()
用途:返回在数组中找到的第一个元素的索引,如果没有找到则返回 -1。
示例:
let arr = [1, 2, 3, 4, 5];
let index = arr.indexOf(3);
console.log(index); // 输出: 2
15. lastIndexOf()
用途:返回在数组中找到的最后一个元素的索引,如果没有找到则返回 -1。
示例:
let arr = [1, 2, 3, 2, 4, 5];
let index = arr.lastIndexOf(2);
console.log(index); // 输出: 3
16. includes()
用途:检查数组是否包含特定元素,并返回布尔值。
示例:
let arr = [1, 2, 3, 4, 5];
let containsThree = arr.includes(3);
console.log(containsThree); // 输出: true
17. every()
用途:检查数组中的所有元素是否都满足条件。
示例:
let arr = [2, 4, 6, 8];
let allEven = arr.every(x => x % 2 === 0);
console.log(allEven); // 输出: true
18. some()
用途:检查数组中是否有至少一个元素满足条件。
示例:
let arr = [2, 4, 6, 8, 9];
let hasOdd = arr.some(x => x % 2 !== 0);
console.log(hasOdd); // 输出: true
19. filter()
用途:创建一个新数组,其包含通过测试的所有元素。
示例:
let arr = [1, 2, 3, 4, 5];
let evenNumbers = arr.filter(x => x % 2 === 0);
console.log(evenNumbers); // 输出: [2, 4]
20. map()
用途:创建一个新数组,其结果是调用一个提供的函数产生的数组每个元素的结果。
示例:
let arr = [1, 2, 3, 4, 5];
let squaredNumbers = arr.map(x => x * x);
console.log(squaredNumbers); // 输出: [1, 4, 9, 16, 25]
21. forEach()
用途:对数组中的每个元素执行一个提供的函数。
示例:
let arr = [1, 2, 3, 4, 5];
arr.forEach(x => console.log(x * x));
// 输出:
// 1
// 4
// 9
// 16
// 25
22. reduce()
用途:对数组中的每个元素执行一个由左至右的累加器函数,将其结果汇总为单个输出值。
示例:
let arr = [1, 2, 3, 4, 5];
let sum = arr.reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 输出: 15
23. flat()
用途:创建一个新数组,其中所有元素都是原数组元素的子元素的扁平化版本。
示例:
let arr = [1, 2, [3, 4], [5, [6, 7]]];
let flattenedArr = arr.flat(2);
console.log(flattenedArr); // 输出: [1, 2, 3, 4, 5, 6, 7]
24. flatMap()
用途:首先映射数组中的每个元素,然后将结果展平到最大深度为 1 的新数组。
示例:
let arr = [1, 2, [3, 4]];
let mappedAndFlattened = arr.flatMap(x => [x * 2]);
console.log(mappedAndFlattened); // 输出: [2, 4, [6, 8]]
当然,JavaScript 中的数组提供了许多其他有用的方法。除了之前提到的方法外,这里还有一些额外的方法以及它们的用法和示例。
25. fill()
用途:用给定值填充数组的一部分或全部。
示例:
let arr = [1, 2, 3, 4, 5];
arr.fill(0);
console.log(arr); // 输出: [0, 0, 0, 0, 0]
arr.fill(7, 1, 3);
console.log(arr); // 输出: [0, 7, 7, 0, 0]
26. copyWithin()
用途:将数组的一部分复制到数组的另一部分,不会离开原数组。
示例:
let arr = [1, 2, 3, 4, 5];
arr.copyWithin(2, 0, 3);
console.log(arr); // 输出: [1, 2, 1, 2, 5]
27. find()
用途:返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
示例:
let arr = [1, 2, 3, 4, 5];
let found = arr.find(x => x > 3);
console.log(found); // 输出: 4
28. findIndex()
用途:返回数组中满足提供的测试函数的第一个元素的索引。否则返回 -1。
示例:
let arr = [1, 2, 3, 4, 5];
let index = arr.findIndex(x => x > 3);
console.log(index); // 输出: 3
29. entries()
用途:返回一个数组迭代器对象,该对象包含数组的键值对。
示例:
let arr = [1, 2, 3];
let iterator = arr.entries();
for (let entry of iterator) {
console.log(entry); // 输出: [0, 1], [1, 2], [2, 3]
}
30. keys()
用途:返回一个数组迭代器对象,该对象包含数组的键。
示例:
let arr = [1, 2, 3];
let iterator = arr.keys();
for (let key of iterator) {
console.log(key); // 输出: 0, 1, 2
}
31. values()
用途:返回一个数组迭代器对象,该对象包含数组的值。
示例:
let arr = [1, 2, 3];
let iterator = arr.values();
for (let value of iterator) {
console.log(value); // 输出: 1, 2, 3
}
32. at()
用途:返回指定位置的元素,支持负索引。
示例:
let arr = [1, 2, 3, 4, 5];
let element = arr.at(-1);
console.log(element); // 输出: 5
33. toString()
用途:将数组转换为字符串,元素之间用逗号分隔。
示例:
let arr = [1, 2, 3];
let str = arr.toString();
console.log(str); // 输出: "1,2,3"
34. toLocaleString()
用途:返回数组转换为本地格式的字符串。
示例:
let arr = [1, 2, 3];
let str = arr.toLocaleString();
console.log(str); // 输出: "1,2,3"
35. with()
用途:返回一个新数组,其中某个元素已被替换。
示例:
let arr = [1, 2, 3];
let newArr = arr.with(1, 7);
console.log(newArr); // 输出: [1, 7, 3]
36. isArray()
用途:检查传递的值是否为数组。
示例:
let arr = [1, 2, 3];
let obj = { a: 1 };
console.log(Array.isArray(arr)); // 输出: true
console.log(Array.isArray(obj)); // 输出: false
总结
这些方法进一步增强了 JavaScript 数组的功能,使你能够更灵活地操作数组。通过使用这些方法,你可以轻松地实现数组的填充、复制、搜索,排序、过滤、映射、累加等。这些方法使得 JavaScript 中的数组操作更加灵活和高效。