如何添加项目到 JavaScript 数组

原文： JavaScript Add to an Array – JS Append

你可以在 JavaScript 中使用数组来存储一组变量，它们通常被称为数组的元素或项目。这些元素中的每一个都会有一个索引。索引从零开始。

默认情况下，你可以使用数组中某个元素的索引来访问或修改其值。

但是 JavaScript 提供了不同的方法，你可以用这些方法来增加/追加更多的元素到一个数组。

如何在 JavaScript 中使用 push 方法向数组中添加一个元素

push 方法把要添加到数组中的元素作为其参数。

下面是一个例子：

let myArr = [2, 4, 6];

myArr.push(8);

console.log(myArr);
// [ 2, 4, 6, 8 ]

在上面的代码中，myArr 数组在初始化时有 3 个元素——[2, 4, 6]。

使用 push 方法，我们将 8 添加到数组中：myArr.push(8)。

在使用 push 方法时，你可以通过将元素作为参数并用逗号隔开来添加一个以上的元素，例如：

let myArr = [2, 4, 6];

myArr.push(8, 10, 12);

console.log(myArr);
// [ 2, 4, 6, 8, 10, 12 ]

你可以使用 splice 方法在数组中添加新元素、移除元素和替换现有元素。

语法如下：

splice(index, deleteNum, item1, ..., itemN)

让我们看一下上面每个参数的含义：

index 表示 splice 方法将开始操作的起始索引。

deleteNum 表示从 index 开始要删除的元素的数量。

item1 表示在 index 处要插入的元素的值。

如果上面的解释看起来令人困惑，下面的例子应该能帮助你更好地理解。

下面是第一个例子，展示了如何使用 splice 方法将一个元素追加到一个数组中：

let myArr = [2, 4, 6];

myArr.splice(3,0,8)

console.log(myArr);
// [ 2, 4, 6, 8 ]

让我们把上面的代码分解成最简单的形式。从索引开始——该数组最初有三个项目：
2 => 索引 0
4 => 索引 1
6 => 索引 2

我们向 splice 方法传入三个参数：splice(3,0,8)。

第一个参数 3 表示 splice 方法的起始索引。在我们的数组中，索引 3 紧随最后一个元素之后。

第二个参数 0 表示从索引 3（上面指定的索引）开始要删除的元素的数量。

第三个参数 8 表示要在指定的索引上插入的值。所以 8 被插入到索引 3 处。当记录到控制台时，我们有这样的结果：[ 2, 4, 6, 8 ]。

如果你了解 splice 方法的工作原理，那么你也许应该跳到下一节。如果你不了解，那么你可以看下一个例子如何进一步简化它。

let myArr = [2, 4, 6, 8, 10, 12, 14];

myArr.splice(3,2,16)

console.log(myArr);
// [ 2, 4, 6, 16, 12, 14 ]

让我们像上一个例子那样解释它：

2 => 索引 0
4 => 索引 1
6 => 索引 2
8 => 索引 3
10 => 索引 4
12 => 索引 5
14 => 索引 6

splice 方法有三个参数：splice(3,2,16)。

第一个参数是 3，这意味着我们从索引 3 开始，其值为 8。

第二个参数是 2，表示从索引 3 开始要删除多少个元素。

第三个参数是 16，是要在索引 3 插入的值。

如果你看一下输出，你会发现 16 现在是索引 3，而初始数组中的两个元素（8 和 10）被删除了：[ 2, 4, 6, 16, 12, 14 ]。

因此，数组从：

初始数组 = [ 2, 4, 6, 8, 10, 12, 14 ]。

从索引 3 开始删除两个元素 = [ 2, 4, 6, 12, 14 ] 。

在索引 3 处添加 16 个元素 = [ 2, 4, 6, 16, 12, 14 ]。

你可以使用 concat 方法将两个或更多的数组合并或串联起来。下面是一个例子：

let myArr1 = [2, 4, 6, 8];
let myArr2 = [10, 12, 14]

myArr = myArr1.concat(myArr2)

console.log(myArr);
// [ 2, 4, 6, 8, 10, 12, 14 ]

上面的代码非常简单明了。我们创建了两个不同的数组——myArr1 和 myArr2。

然后我们将两个数组合并成一个数组，存储在 myArr 变量中：myArr1.concat(myArr2)。

你也可以使用 ES6 的扩展语法（...）来合并数组，就像我们在上一节做的那样。

let myArr1 = [2, 4, 6, 8];
let myArr2 = [10, 12, 14]

myArr = [ ...myArr1, ...myArr2]

console.log(myArr);
// [ 2, 4, 6, 8, 10, 12, 14 ]

上面使用的扩展语法将两个数组的所有值复制到 myArr 数组中：myArr = [ ...myArr1, ...myArr2]。

在这篇文章中，我们谈到了你可以用不同的方法来添加和追加元素到一个 JavaScript 数组。

我们给出了使用 push、splice 和 concat方法以及 ES6 扩展语法（...）的例子。

Happy coding!