在 JavaScript 中巧用数组：20 个常见操作

JavaScript 数组操作指南：提升数据处理的 20 种强大方法

创建和初始化数组

要创建数组，我们使用方括号（[]）。它们可以初始化为空，或者使用逗号分隔元素来初始化。例如：

const emptyArray = [];
const numbersArray = [1, 2, 3, 4, 5];

访问数组元素

使用方括号和索引来访问数组元素。索引从 0 开始，表示数组中的第一个元素。例如：

const firstElement = numbersArray[0]; // 1
const lastElement = numbersArray[numbersArray.length - 1]; // 5

添加元素到数组

使用 push() 方法在数组末尾添加元素：

numbersArray.push(6); // [1, 2, 3, 4, 5, 6]

从数组中删除元素

使用 pop() 方法从数组末尾删除元素，或使用 shift() 方法从数组开头删除元素：

numbersArray.pop(); // [1, 2, 3, 4, 5]
numbersArray.shift(); // [2, 3, 4, 5]

查找数组元素

使用 indexOf() 和 lastIndexOf() 方法查找数组中元素的索引：

const index = numbersArray.indexOf(3); // 2
const lastIndex = numbersArray.lastIndexOf(3); // 2

连接数组

使用 concat() 方法连接两个或多个数组：

const combinedArray = numbersArray.concat([6, 7, 8]); // [1, 2, 3, 4, 5, 6, 7, 8]

数组反转

使用 reverse() 方法反转数组中元素的顺序：

numbersArray.reverse(); // [5, 4, 3, 2, 1]

排序数组

使用 sort() 方法对数组中的元素进行排序，按升序或降序：

numbersArray.sort(); // [1, 2, 3, 4, 5]
numbersArray.sort((a, b) => b - a); // [5, 4, 3, 2, 1]

映射数组

使用 map() 方法创建数组中每个元素的新数组：

const squaredArray = numbersArray.map(number => number * number); // [1, 4, 9, 16, 25]

过滤数组

使用 filter() 方法创建数组中满足特定条件的新数组：

const evenArray = numbersArray.filter(number => number % 2 === 0); // [2, 4]

归约数组

使用 reduce() 方法将数组中的元素归约为单个值：

const sum = numbersArray.reduce((a, b) => a + b, 0); // 15

查找数组中的最大值和最小值

使用 Math.max() 和 Math.min() 方法查找数组中的最大值和最小值：

const maxValue = Math.max(...numbersArray); // 5
const minValue = Math.min(...numbersArray); // 1

检查数组是否为空

使用 Array.isArray() 方法检查一个变量是否是一个数组，以及 length 属性检查数组是否为空：

if (Array.isArray(numbersArray) && numbersArray.length === 0) {
  // 数组为空
}

打乱数组

使用 sort() 方法并传入一个随机比较函数来打乱数组中的元素顺序：

numbersArray.sort(() => Math.random() - 0.5); // 打乱后的数组

数组去重

使用 Set() 对象或 filter() 方法对数组进行去重：

const uniqueArray = [...new Set(numbersArray)]; // 使用 Set
const uniqueArray = numbersArray.filter((item, index) => numbersArray.indexOf(item) === index); // 使用 filter

数组交集

使用 filter() 方法查找两个数组的交集：

const intersection = numbersArray.filter(number => otherArray.includes(number)); // 交集数组

数组并集

使用 concat() 方法查找两个数组的并集：

const union = numbersArray.concat(otherArray); // 并集数组

数组差集

使用 filter() 方法查找两个数组的差集：

const difference = numbersArray.filter(number => !otherArray.includes(number)); // 差集数组

数组切片

使用 slice() 方法从数组中提取一个子数组：

const subarray = numbersArray.slice(1, 3); // [2, 3]

展开数组

使用 ... 展开运算符将数组元素展开为单个元素：

const spreadArray = [...numbersArray, 6, 7, 8]; // [1, 2, 3, 4, 5, 6, 7, 8]

结论

掌握这些 JavaScript 数组操作，你将能够轻松管理和处理数据。从添加和删除元素到排序、过滤和映射，这些操作让你有效地操纵数组，构建强大而灵活的应用程序。

常见问题解答

1. 如何检查数组是否包含特定元素？

你可以使用 includes() 方法检查数组是否包含特定元素。

2. 如何获取数组的第一个元素？

可以使用 [0] 索引访问数组的第一个元素。

3. 如何在数组的中间插入元素？

使用 splice() 方法在指定索引处插入元素。

4. 如何删除数组中的所有元素？

使用 length = 0 将数组的长度设置为 0。

5. 如何将一个字符串转换为数组？

使用 split() 方法以分隔符将字符串转换为数组。