JavaScript 数组

数组是有序的数据集合，是 JavaScript 中使用最频繁的数据结构。一个数组可以存储任意类型的数据。

创建和访问

javascript 
// 字面量创建（推荐）
const fruits = ['苹果', '香蕉', '橘子'];

// 构造函数创建（少用）
const numbers = new Array(1, 2, 3);

// 访问元素（索引从 0 开始）
console.log(fruits[0]);     // "苹果"
console.log(fruits[2]);     // "橘子"
console.log(fruits.length); // 3

// 最后一个元素
console.log(fruits[fruits.length - 1]); // "橘子"

基础操作

添加和删除元素

javascript 
const arr = ['B'];

// 末尾操作
arr.push('C');               // ["B", "C"] 末尾添加
const last = arr.pop();      // "C"，arr 变为 ["B"]

// 开头操作
arr.unshift('A');            // ["A", "B"] 开头添加
const first = arr.shift();   // "A"，arr 变为 ["B"]

// arr 现在：["B"]

slice() — 截取（不修改原数组）

javascript 
const arr = ['A', 'B', 'C', 'D', 'E'];

arr.slice(1, 3);   // ["B", "C"]（索引 1~2）
arr.slice(2);      // ["C", "D", "E"]（从索引 2 到末尾）
arr.slice(-2);     // ["D", "E"]（倒数 2 个）
arr.slice();       // 完整副本（常用于复制数组）

splice() — 增删改（会修改原数组）

javascript 
const arr = ['A', 'B', 'C', 'D'];

// 删除：从索引1开始，删2个
arr.splice(1, 2);            // 返回 ["B", "C"]，arr 变为 ["A", "D"]

// 插入：从索引1开始，删0个，插入元素
arr.splice(1, 0, 'X', 'Y');  // arr 变为 ["A", "X", "Y", "D"]

// 替换：从索引1开始，删2个，插入元素
arr.splice(1, 2, 'Z');       // arr 变为 ["A", "Z", "D"]

查找元素

javascript 
const arr = ['苹果', '香蕉', '橘子', '香蕉'];

arr.indexOf('香蕉');      // 1（首次出现的索引）
arr.lastIndexOf('香蕉');  // 3（最后出现的索引）
arr.indexOf('葡萄');      // -1（不存在）

arr.includes('苹果');     // true
arr.includes('葡萄');     // false

遍历数组

forEach() — 逐一处理

javascript 
const items = ['A', 'B', 'C'];

items.forEach((item, index) => {
  console.log(`${index}: ${item}`);
});
// 输出：0: A  1: B  2: C

forEach() 不能中途退出（break 无效）。如果需要提前终止循环，用 for...of 或普通 for 循环。

for...of — 遍历值

javascript 
for (const item of items) {
  console.log(item);
}

数组变换（核心方法）

这些方法是现代 JavaScript 的精华，都不修改原数组，而是返回新数组。

map() — 映射

将每个元素转换为新值，生成等长的新数组：

javascript 
const numbers = [1, 2, 3, 4];

const doubled = numbers.map(n => n * 2);
// [2, 4, 6, 8]

const labels = numbers.map(n => `第${n}项`);
// ["第1项", "第2项", "第3项", "第4项"]

filter() — 过滤

保留满足条件的元素，生成可能较短的新数组：

javascript 
const numbers = [1, 2, 3, 4, 5, 6];

const evens = numbers.filter(n => n % 2 === 0);
// [2, 4, 6]

const adults = users.filter(user => user.age >= 18);

reduce() — 归约

将数组”压缩”为一个值：

javascript 
const numbers = [1, 2, 3, 4];

const sum = numbers.reduce((total, current) => total + current, 0);
// total 是累积值，current 是当前元素，0 是初始值
// 计算过程：0 → 1 → 3 → 6 → 10

find() / findIndex()

javascript 
const users = [
  { id: 1, name: '张三' },
  { id: 2, name: '李四' },
  { id: 3, name: '王五' },
];

users.find(user => user.id === 2);       // { id: 2, name: '李四' }
users.findIndex(user => user.id === 2);  // 1
users.find(user => user.id === 99);      // undefined（没找到）

sort() — 排序

sort() 会修改原数组，且默认按字符串排序：

javascript 
// 数字排序（升序）
const nums = [3, 1, 10, 2];
nums.sort((a, b) => a - b); // [1, 2, 3, 10]

// 数字排序（降序）
nums.sort((a, b) => b - a); // [10, 3, 2, 1]

// 字符串排序
const names = ['王五', '张三', '李四'];
names.sort(); // ["张三", "李四", "王五"]（按拼音/Unicode）

其他常用方法

javascript 
const arr1 = [1, 2];
const arr2 = [3, 4];

// 合并
arr1.concat(arr2);          // [1, 2, 3, 4]
[...arr1, ...arr2];         // [1, 2, 3, 4]（展开运算符，推荐）

// 转为字符串
[1, 2, 3].join(', ');       // "1, 2, 3"

// 反转
[1, 2, 3].reverse();        // [3, 2, 1]（会修改原数组）

// 检查是否为数组
Array.isArray([1, 2, 3]);   // true
Array.isArray('hello');     // false