JavaScript 中Array 整理

系统梳理一下 JavaScript 中 Array 最常用的方法。

一、添加 / 删除元素（修改原数组）

这类方法会直接改变原数组的内容。

push()
- 功能：在数组的末尾添加一个或多个元素。
- 返回值：新数组的长度。
  
  示例：
  javascript 复制代码
```
const arr = [1, 2, 3];
arr.push(4, 5);
console.log(arr); // 输出: [1, 2, 3, 4, 5]
```
pop()
- 功能：删除并返回数组的最后一个元素。
- 返回值：被删除的元素。
  
  示例：
  javascript 复制代码
```
const arr = [1, 2, 3];
const last = arr.pop();
console.log(arr); // 输出: [1, 2]
console.log(last); // 输出: 3
```
unshift()
- 功能：在数组的开头添加一个或多个元素。
- 返回值：新数组的长度。
  示例：
  javascript 复制代码
```
const arr = [3, 4, 5];
arr.unshift(1, 2);
console.log(arr); // 输出: [1, 2, 3, 4, 5]
```
shift()
- 功能：删除并返回数组的第一个元素。
- 返回值：被删除的元素。
  示例：
  javascript 复制代码
```
const arr = [1, 2, 3];
const first = arr.shift();
console.log(arr); // 输出: [2, 3]
console.log(first); // 输出: 1
```

splice()

功能：一个非常强大的方法，可以删除、插入或替换数组中的元素。
语法：array.splice(startIndex, deleteCount, item1, item2, ...)

返回值：包含被删除元素的数组。

示例：

javascript 复制代码

const arr = ['a', 'b', 'c', 'd'];

// 删除：从索引1开始，删除2个元素
const removed = arr.splice(1, 2);
console.log(arr); // 输出: ['a', 'd']
console.log(removed); // 输出: ['b', 'c']

// 插入：从索引1开始，删除0个元素，并插入 'x', 'y'
arr.splice(1, 0, 'x', 'y');
console.log(arr); // 输出: ['a', 'x', 'y', 'd']

// 替换：从索引2开始，删除1个元素，并插入 'z'
arr.splice(2, 1, 'z');
console.log(arr); // 输出: ['a', 'x', 'z', 'd']

二、创建新数组（不修改原数组）

这类方法不会改变原数组，而是返回一个全新的数组，非常适合在函数式编程或需要保持数据不可变性的场景中使用。

slice()

功能：截取数组的一部分，返回一个新数组。
语法：array.slice(startIndex, endIndex)（endIndex 不包含）

返回值：一个包含截取元素的新数组。

示例：

javascript 复制代码

const arr = ['a', 'b', 'c', 'd', 'e'];
const newArr = arr.slice(1, 4); // 从索引1到索引4（不包含4）
console.log(newArr); // 输出: ['b', 'c', 'd']
console.log(arr);   // 原数组不变: ['a', 'b', 'c', 'd', 'e']

concat()
- 功能：连接两个或多个数组 / 值，返回一个新数组。
- 返回值：一个新的、连接后的数组。
  
  示例：
  javascript 复制代码
```
const arr1 = [1, 2];
const arr2 = [3, 4];
const combined = arr1.concat(arr2, 5, 6);
console.log(combined); // 输出: [1, 2, 3, 4, 5, 6]
```
map()
- 功能：遍历数组的每个元素，并对每个元素执行一个回调函数，将回调函数的返回值组成一个新数组返回。
- 核心："映射"，即一对一地将原数组元素转换为新元素。
  
  示例：
  javascript 复制代码
```
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // 输出: [2, 4, 6, 8]
```
filter()
- 功能：遍历数组，根据回调函数返回的布尔值（true/false）来 "过滤" 元素，将返回 true 的元素组成一个新数组返回。
- 核心："过滤"，即筛选出符合条件的元素。
  
  示例：
  javascript 复制代码
```
const numbers = [1, 2, 3, 4, 5, 6];
const evens = numbers.filter(num => num % 2 === 0);
console.log(evens); // 输出: [2, 4, 6]
```
reduce()
- 功能：遍历数组，将数组元素 "累积" 成一个单一的值（可以是数字、对象、数组等）。
- 核心："归约" 或 "累积"。
  
  示例：
  javascript 复制代码
```
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum); // 输出: 10
```

三、数组遍历 / 查找

这类方法用于遍历数组元素或查找特定元素。

forEach()
- 功能：遍历数组的每个元素，并对每个元素执行一个回调函数。
- 与 map 的区别：forEach 没有返回值（undefined），它仅用于执行副作用（如打印、修改外部变量）。
  
  示例：
  javascript 复制代码
```
const fruits = ['apple', 'banana', 'cherry'];
fruits.forEach(fruit => console.log(fruit));
// 输出:
// apple
// banana
// cherry
```

find()

功能：遍历数组，返回第一个满足回调函数条件的元素。

返回值：找到的元素，如果没有找到则返回 undefined。

示例：

javascript 复制代码

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' }
];
const user = users.find(u => u.id === 2);
console.log(user); // 输出: { id: 2, name: 'Bob' }

findIndex()
- 功能：遍历数组，返回第一个满足回调函数条件的元素的索引。
- 返回值：找到的元素的索引，如果没有找到则返回 -1。
  
  示例：
  javascript 复制代码
```
const numbers = [5, 12, 8, 130, 44];
const index = numbers.findIndex(num => num > 10);
console.log(index); // 输出: 1 (因为 12 是第一个大于10的数，其索引为1)
```
includes()
- 功能：判断数组是否包含某个指定的元素。
- 返回值：布尔值（true 表示包含，false 表示不包含）。
  
  示例：
  javascript 复制代码
```
const arr = [1, 2, 3, 4];
console.log(arr.includes(2)); // 输出: true
console.log(arr.includes(5)); // 输出: false
```

四、数组排序与反转

sort()

功能：对数组元素进行原地排序。

注意：默认按 Unicode 编码排序，对数字排序时需要传入自定义比较函数。

示例：

javascript 复制代码

const fruits = ['banana', 'apple', 'cherry'];
fruits.sort();
console.log(fruits); // 输出: ['apple', 'banana', 'cherry']

const numbers = [3, 1, 4, 1, 5, 9];
numbers.sort((a, b) => a - b); // 数字升序
console.log(numbers); // 输出: [1, 1, 3, 4, 5, 9]

reverse()

功能：将数组元素原地反转。

示例：

javascript 复制代码

const arr = [1, 2, 3, 4];
arr.reverse();
console.log(arr); // 输出: [4, 3, 2, 1]