21个常用JavaScript 数组方法使用指南汇总

在 JavaScript 中，数组是一种特殊类型的对象，用于存储和组织多个值。数组使您可以将值分组到单个变量名下，从而方便管理和操作数据集合。以下是更详细的解释：

在 JavaScript 中，一对方括号 [] 表示数组。数组中的所有元素都用逗号 , 分隔。

在 JavaScript 中，数组可以包含任何类型的元素。这意味着您可以创建包含 String、Boolean、Number、Object 甚至其他数组等类型的元素的数组。

以下是一个包含四个元素的数组示例：Number、Boolean、String 和 Object。

const mixTypedArray = [ 100 , true , 'javascript' , {}];

元素在数组中的位置称为其索引。在 JavaScript 中，数组索引从 0 开始，每个元素递增 1。

例如，在上面的数组中，元素 100 位于索引 0，true 位于索引 1，'javascript' 位于索引 2，依此类推。

数组中元素的数量决定了其长度。例如，上述数组的长度为 4。

有趣的是，JavaScript 数组的长度不是固定的。您可以通过分配正数值随时更改长度。我们稍后会对此进行更多了解。

破坏性数组方法

破坏性数组方法会更改原始数组并返回修改后的数组。让我们探索各种用于操作更改原始数组的数组的方法。

添加或删除数组的方法

通常需要添加或删除数组中的元素。例如，考虑这个名称数组：

let names = ["John Doe", "Jane Doe", "Ann Doe"];

您可以使用以下方法之一来操作此数组，以从数组中添加或删除第一个、最后一个或特定元素。

01、pop()

此方法删除附加的 JavaScript 数组的最后一个元素，更改原始数组，并返回已删除的元素。

myArray.pop();

注意：您不会将任何内容作为参数传递给 pop() 方法。

以下示例展示了如何使用 pop() 方法：

let names = ["John Doe", "Jane Doe", "Ann Doe"];names.pop(); // "Ann Doe"console.log(names); // ['John Doe', 'Jane Doe']

02、push()

此方法将新元素添加到附加的 JavaScript 数组的末尾，更改原始数组，并返回数组的新长度。此方法接受您希望添加到数组末尾的元素作为参数。

myArray.push(element1, element2, ..., elementX);

现在让我们创建一个新的分数数组，然后使用 push() 方法向数组添加更多分数：

let scores = [12, 55, 78, 95, 33];scores.push(66, 77); // 7
console.log(scores); // [12, 55, 78, 95, 33, 66, 77]

03、shift()

shift() 方法删除数组的第一个元素。它的工作方式与 pop() 方法类似，但不是从末尾删除，而是从附加数组的开头删除。它返回已删除/已移位的元素。

myArray.shift();

现在让我们创建一个新的动物名称数组，然后学习如何使用 shift() 方法从数组中删除第一个名称：​​​​​​​

let animalNames = ["Lion", "Dog", "Snake", "Tiger"];animalNames.shift(); // "Lion"
console.log(animalNames); // ['Dog', 'Snake', 'Tiger']

04、unshift()

unshift() 方法的工作方式与 push() 方法类似，因为它用于将新元素添加到数组中，但添加到数组的开头。此方法将您希望在数组开头添加的元素作为参数。它还返回数组的新长度。

myArray.unshift(element1, element2, ..., elementX);

现在让我们创建一个新的食物名称数组，然后使用 unshift() 方法向数组添加更多食物名称：​​​​​​​

let foodNames = ["Salad", "Bread", "Fish", "Rice"];foodNames.unshift("Pizza", "Cake"); // Returns 6 - the length of the newly changed arrayconsole.log(foodNames); // ['Pizza', 'Cake', 'Salad', 'Bread', 'Fish', 'Rice']

05、splice()

splice() 方法从数组中添加或删除特定元素。删除元素时，它会返回数组中已删除的元素，添加元素时，它会返回一个空数组。

myArray.splice(index, howMany, element1, element2, ..., elementX);

在上面的语法中，index 是一个必需参数，表示要添加或删除元素的位置。howMany 是一个可选参数，表示要删除的元素数量。任何其他参数都是可选的，表示要添加到指定位置的新元素。

假设您有一个水果数组