如何在 JavaScript 中使用数组方法：访问方法

介绍

JavaScript 数组是一个由元素列表组成的数据类型,在 JavaScript 中有许多有用的内置方法来使用数组。修改原始数组的方法被称为 mutator 方法,而返回新值或表示的方法被称为 accessor 方法。

为了充分利用本教程,您应该熟悉创建,索引,修改和循环数组,您可以在教程中审查理解JavaScript中的数组。

本教程将探讨将数组连接,将数组转换为字符串,将数组的部分复制到新数组,并找到数组的索引的方法。

<$>[注] 注: Array 方法被正确地编写为 Array.prototype.method(),因为 Array.prototype 指的是 Array 对象本身。

孔子( )

concat()方法将两个或多个数组合并,形成一个新的数组。

在下面的示例中,我们将创建两种壳类型的数组,并将它们合并成一个新的数组。

1// Create arrays of monovalves and bivalves
2let monovalves = [ "abalone", "conch" ];
3let bivalves = [ "oyster", "mussel", "clam" ];
4
5// Concatenate them together into shellfish variable
6let shellfish = monovalves.concat(bivalves);

一旦我们调用了新数组,我们就会看到它由两个原始数组组成:

1shellfish;

1[secondary_label Output]
2[ 'abalone', 'conch', 'oyster', 'mussel', 'clam' ]

concat()方法可以使用多个参数,有效地允许您将多个数组连接到一个方法。

加入( )

join()方法将一个数组的所有元素转换为一个新的字符串。

1let fish = [ "piranha", "barracuda", "koi", "eel" ];

如果没有给出的参数,则join()的输出将是一个单字节分开的字符串,没有额外的白色空间。

1// Join the elements of an array into a string
2let fishString = fish.join();
3
4fishString;

1[secondary_label Output]
2'piranha,barracuda,koi,eel'

为了包括白空间或其他分离器,您可以将分离器的字符串作为参数添加到 join() 方法. 此参数将包含您想要的分离器在每个数组元素之间。

1// Join the elements of an array into a string
2let fishString = fish.join(', ');
3
4fishString;

1[secondary_label Output]
2'piranha, barracuda, koi, eel'

在上面的示例中,用 whitespace 写 `', '将数组项目以更易于阅读的方式分开,作为一个参数提供的空串将完全删除默认符号。

( )

slice() 方法将数组的一部分复制到新的数组中。

1let fish = [ "piranha", "barracuda", "koi", "eel" ];

假设我们想将数组中的最后两个项目复制到一个新的数组,我们会从我们想要的第一个元素的索引号开始,即2为koi。

1// Slice a new array from 2 to 5
2let fishWithShortNames = fish.slice(2, 4);
3
4fishWithShortNames;

1[secondary_label Output]
2[ 'koi', 'eel' ]

在此特定情况下,由于el是数组中的最后一个项目,所以第二个参数实际上是不必要的. 如果没有提供第二个参数,则slice()将从第一个索引开始,并在数组的末尾停止。

1// Slice a new array from 2 to the end of the array
2let fishWithShortNames = fish.slice(2);
3
4fishWithShortNames;

1[secondary_label Output]
2[ 'koi', 'eel' ]

’slice()’ 不能与 [mutator method splice()](https://andsky.com/tech/tutorials/how-to-use-array-methods-in-javascript-mutator-methods#splice()]混淆,它可以从原始数组中添加或删除项目。

指数( )

「indexOf()」方法返回元素的第一个实例的索引号。

在下面的示例中,我们有一个字符串,其中barracuda列出两次。

1let fish = [ "piranha", "barracuda", "koi", "barracuda" ];

我们将使用indexOf()来找到第一个实例。

1// Find the first instance of an element
2fish.indexOf("barracuda");

1[secondary_label Output]
21

如果该参数是数组中不存在的值,则控制台将返回-1。

1fish.indexOf("shark");

1[secondary_label Output]
2-1

「indexOf()」方法在包含许多项目的数组中尤其有用。

主持人( )

最后IndexOf() 方法返回元素的最后实例的索引号。

我們可以從「indexOf()」測試同樣的例子,其中包含「barracuda」兩次。

1let fish = [ "piranha", "barracuda", "koi", "barracuda" ];
2
3// Find the last instance of an element
4fish.lastIndexOf("barracuda");

1[secondary_label Output]
23

lastIndexOf() 會從端開始搜尋數列,並返回所找到的第一個索引數。

结论

在本教程中,我们审查了JavaScript中的主要内置附件数组方法. 附件方法创建一个数组的新副本或表示,而不是突变或修改原始。

我们学会了如何将数组连接在一起,将它们从端到端结合起来,以及如何将数组转换为单行分开的字符串。

若要查看数组的基本知识,请阅读理解 JavaScript 中的数组。若要查看所有数组方法的完整列表,请参阅 Mozilla 开发者网络上的数组参考。