如何在特定索引处插入 JavaScript 数组 – JS Push

JavaScript 数组是该语言的重要组成部分。它们允许您存储和操作数据集合。

有时，您可能需要在特定索引处将新元素插入到数组中。要完成此任务，您可以使用push()方法或splice()方法。

在本文中，您将详细了解如何使用这两种技术。

JavaScript 数组的工作原理
在深入探讨插入方法之前，让我们简要回顾一下 JavaScript 中的数组。

数组是任何数据类型的数据值的集合。您可以使用数组构造函数或文字表示法创建数组。

下面是使用数组构造函数创建的数组示例：

const arrayConstructor = new Array(1, 2, 3);
console.log(arrayConstructor); // Output: [1, 2, 3]
下面是使用文字符号创建的数组示例：

const literalArray = [1, 2, 3];
console.log(literalArray); // Output: [1, 2, 3]
在这两种情况下，您都有一个包含三个元素的数组：1、2和3。

push()如何使用方法在特定索引处插入 JavaScript 数组
JavaScript 数组中的方法用于将一个或多个元素添加到数组的末尾。push()

让我们看一下该方法的语法push()：

array.push(element1, element2, …, elementN);
此处，array是要向其添加元素的数组，而element1、element2等是要添加到数组末尾的元素。

例如，假设你有一个水果数组，你想在它的末尾添加一个元素：

const fruits = [‘apple’, ‘banana’, ‘cherry’];
fruits.push(‘date’);
console.log(fruits); // Output: [‘apple’, ‘banana’, ‘cherry’, ‘date’]
在此代码中，使用方法’date’将其添加到数组的末尾。fruitspush()

有时您可能需要在数组的特定索引处插入一个元素。在这种情况下，您可以将该push()方法与数组切片结合使用。

以下是在数组中的特定索引处插入元素的步骤：

创建一个新的空数组。
将原数组中特定索引之前的元素复制到新数组中。
将新元素添加到新数组。
将原数组中特定索引后的元素复制到新数组中。
让我们用一个例子来说明这些步骤。假设你有一个数字数组：

const numbers = [1, 2, 4, 5];
3你想在索引处插入数字2（记住 JavaScript 使用从零开始的索引）。您可以通过以下方式完成此操作：

const index = 2;
const newNumbers = [
…numbers.slice(0, index),
3,
…numbers.slice(index)
];
console.log(newNumbers); // Output: [1, 2, 3, 4, 5]
在此示例中，通过使用方法newNumbers复制索引之前的元素来创建一个新数组。接下来是新元素，最后您再次使用该方法复制索引后的剩余元素。结果是新数组。2slice()32slice()[1, 2, 3, 4, 5]

上例中的展开运算符 ( …) 用于连接数组。

但这不是最佳方法，因为您最终会使用另一种方法 ( slice)，这会使初学者难以理解代码。让我们探讨如何使用更直接的拼接方法。

如何使用该splice()方法在特定索引处插入 JavaScript 数组
JavaScript 数组中的方法splice()用于在数组中添加或删除元素。您可以使用该splice()方法在数组中的特定索引处插入元素。

这是该splice()方法的语法：

array.splice(start, deleteCount, item1, item2, …, itemN);
array是您要修改的数组。
start是要开始修改数组的索引。
deleteCount是要从数组中删除的元素数，从索引开始start。
item1, item2, 等等是您要添加到数组索引处的元素start。
例如，假设您有一个数字数组：

const numbers = [1, 2, 4, 5];
3并且您想在 index 处插入数字2。以下是使用方法完成此操作的方法splice()：

numbers.splice(2, 0, 3);
console.log(numbers); // Output: [1, 2, 3, 4, 5]
在此代码中，该splice()方法在数组上调用numbers，从 index 开始2，a deleteCountof 0。然后将新元素添加3到数组中的索引处start。结果是修改后的数组[1, 2, 3, 4, 5]。

结论
在本文中，您学习了将元素插入特定索引处的 JavaScript 数组的两种主要技术。

该splice()方法应该是您的首选，因为它具有更好、更直接的语法。了解这些技术将使您能够更有效地操作 JavaScript 数组。

踏上学习之旅！浏览 200 多篇有关 Web 开发的专家文章。查看我的博客，了解我提供的更多精彩内容。

享受编码乐趣！