1. JavaScript 数组概述
数组是 JavaScript 中用于存储多个值的数据结构。它可以存储不同类型的元素，并提供强大的方法来操作和管理数据。数组的元素按索引（从 0 开始）进行访问。
2. 数组的创建方式
1) 使用数组字面量
javascript">let fruits = ["苹果", "香蕉", "橘子"];
2) 使用 Array 构造函数
javascript">let numbers = new Array(5); // 创建一个长度为 5 的空数组
let colors = new Array("红色", "蓝色", "绿色");
3) 空数组
javascript">let emptyArray = [];
3. 数组的遍历方法
1) for 循环遍历
javascript">let fruits = ["苹果", "香蕉", "橘子"];
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
2) for…of 循环
javascript">for (let fruit of fruits) {
console.log(fruit);
}
3) for…in循环
javascript">for (let index in fruits) {
console.log(fruits[index]);
}
4. 常用数组方法
| 方法 | 描述 | 示例 |
|---|---|---|
join() | 将数组中的所有元素连接成一个字符串。 | fruits.join(", ") // "苹果, 香蕉, 橘子" |
push() | 向数组末尾添加一个或多个元素，返回新数组的长度。 | fruits.push("葡萄") // 返回新长度 4 |
pop() | 移除数组末尾的元素，返回被移除的元素。 | fruits.pop() // 返回 "橘子" |
shift() | 移除数组开头的元素，返回被移除的元素。 | fruits.shift() // 返回 "苹果" |
unshift() | 在数组开头添加一个或多个元素，返回新数组的长度。 | fruits.unshift("菠萝") // 返回新长度 4 |
sort() | 对数组元素进行排序，默认按字符编码顺序。 | numbers.sort() // [11, 21, 300, 34, 43] |
reverse() | 反转数组中元素的顺序。 | fruits.reverse() // ["橘子", "香蕉", "苹果"] |
concat() | 合并两个或多个数组，返回新数组。 | fruits.concat(["葡萄"]) // ["苹果", "香蕉", "橘子", "葡萄"] |
slice() | 返回数组中指定开始到结束之间的元素，不修改原数组。 | fruits.slice(0, 2) // ["苹果", "香蕉"] |
splice() | 删除或替换数组中的元素，并可在指定位置添加新元素。 | fruits.splice(1, 1, "西瓜") // ["苹果", "西瓜", "橘子"] |
indexOf() | 返回数组中某个元素的第一个索引，未找到时返回 -1。 | fruits.indexOf("香蕉") // 返回 1 |
lastIndexOf() | 返回数组中某个元素的最后一个索引，未找到时返回 -1。 | fruits.lastIndexOf("橘子") // 返回 2 |
includes() | 检测数组是否包含某个元素，可以找到 NaN 值。 | [1, 2, NaN].includes(NaN) // true |
toString() | 将数组转换为逗号分隔的字符串。 | [1, 2, 3].toString() // "1,2,3" |
copyWithin() | 在数组内部复制元素到其他位置，不改变数组长度。 | [1, 2, 3, 4, 5].copyWithin(0, 3) // [4, 5, 3, 4, 5] |
map() | 返回一个新数组，每个元素是原数组元素调用函数后的结果。 | [1, 2, 3].map(x => x * 2) // [2, 4, 6] |
filter() | 返回一个新数组，包含通过函数测试的所有元素。 | [1, 2, 3].filter(x => x > 1) // [2, 3]# 1/10 |
fill() | 用指定值填充数组的所有元素。 | [1, 2, 3].fill(0) // [0, 0, 0] |
every() | 检测数组中的所有元素是否都通过了指定函数的测试。 | [1, 2, 3].every(x => x > 0) // true |
some() | 检测数组中是否至少有一个元素通过了指定函数的测试。 | [1, 2, 3].some(x => x > 2) // true |
flat() | 将多维数组扁平化为一维数组。 | [1, [2, [3]]].flat(2) // [1, 2, 3] |
flatMap() | 映射每个元素然后将结果扁平化为一个新数组。 | [1, 2, 3].flatMap(x => [x, x * 2]) // [1, 2, 2, 4, 3, 6] |
ps:sort()方法；NaN：Not a Number；flat(Infinity)多维数组转一维。
5. 示例代码
javascript">let fruits = ["苹果", "香蕉", "橘子"];
// join() 示例
console.log(fruits.join(", ")); // 输出: "苹果, 香蕉, 橘子"
// push() 和 pop() 示例
fruits.push("葡萄");
console.log(fruits); // 输出: ["苹果", "香蕉", "橘子", "葡萄"]
console.log(fruits.pop()); // 输出: "葡萄"
// shift() 和 unshift() 示例
fruits.shift();
console.log(fruits); // 输出: ["香蕉", "橘子"]
fruits.unshift("菠萝");
console.log(fruits); // 输出: ["菠萝", "香蕉", "橘子"]
// sort() 和 reverse() 示例
let numbers = [3, 1, 4, 1, 5, 9];
numbers.sort();
console.log(numbers); // 输出: [1, 1, 3, 4, 5, 9]
numbers.reverse();
console.log(numbers); // 输出: [9, 5, 4, 3, 1, 1]
// slice() 和 splice() 示例
let selectedFruits = fruits.slice(1, 3);
console.log(selectedFruits); // 输出: ["香蕉", "橘子"]
fruits.splice(1, 1, "西瓜");
console.log(fruits); // 输出: ["菠萝", "西瓜", "橘子"]
// indexOf() 和 lastIndexOf() 示例
console.log(fruits.indexOf("西瓜")); // 输出: 1
console.log(fruits.lastIndexOf("橘子")); // 输出: 2
// includes() 示例
console.log(fruits.includes("香蕉")); // 输出: true
console.log([NaN].includes(NaN)); // 输出: true
// toString() 示例
console.log(fruits.toString()); // 输出: "苹果,香蕉,橘子"
// copyWithin() 示例
let numbers = [1, 2, 3, 4, 5];
numbers.copyWithin(0, 3);
console.log(numbers); // 输出: [4, 5, 3, 4, 5]
// map() 示例
let doubledNumbers = numbers.map(num => num * 2);
console.log(doubledNumbers); // 输出: [8, 10, 6, 8, 10]
// filter() 示例
let filteredNumbers = doubledNumbers.filter(num => num > 8);
console.log(filteredNumbers); // 输出: [10, 10]
// fill() 示例
let arr = [1, 2, 3, 4, 5];
arr.fill(0, 1, 4);
console.log(arr); // 输出: [1, 0, 0, 0, 5]
// every() 示例
let allPositive = arr.every(num => num >= 0);
console.log(allPositive); // 输出: true
// some() 示例
let hasZero = arr.some(num => num === 0);
console.log(hasZero); // 输出: true
// flat() 示例
let nestedArr = [1, [2, [3, [4]]]];
let flatArr = nestedArr.flat(2);
console.log(flatArr); // 输出: [1, 2, 3, [4]]
// flatMap() 示例
let mappedArr = [1, 2, 3].flatMap(x => [x, x * 2]);
console.log(mappedArr); // 输出: [1, 2, 2, 4, 3, 6]
凡是过去，皆为序章；凡是未来，皆有可期。
