英文 | https://javascript.plainenglish.io/9-must-know-array-methods-to-boost-your-javascript-skills-4ae1822f7751
翻译 | 杨小二
在 JavaScript 中，数组是一种特殊类型的变量，可以存储不同类型的元素。JavaScript 有一些内置的数组方法，它们在不同的情况下有不同的作用，如果你非常熟悉这些方法的话，将对你非常有帮助，比如，删除、添加、操作数据。了解这些方法将提升你的 JavaScript 技能。
在本文中，我们将看到 9 个基本的 JavaScript 数组方法，它们将帮助你正确操作数据。
9个数组方法如下：
- some()
- map()
- filter()
- find()
- findIndex()
- sort()
- includes()
- reverse()
- concat()
1、some()
如果数组中的特定元素匹配，则 array.some() 方法将返回 true 或 false 作为输出。
当你想要匹配数组中的元素时，此方法很有用。让我们通过一个例子来理解这个方法。我们有一个包含 5 个字母的数组。
const Array = ["a", "b", "c", "d", "e"] 我们将在该数组上应用 array.some() 方法，它将输出 true 或 false。
const Array = ["a", "b", "c", "d", "e"]
Array.some(test => test === "b")
// Output will be True 
2、map()
此方法将函数作为参数，并使用原始数组中每个元素的图像创建一个新数组。元素的数量将相同，但你可以对其应用任何函数。
当你想将函数应用于数组的所有元素时，此方法很有用。
假设我们有一个包含 5 个元素编号的数组，我们的任务是应用 map 方法并将所有元素乘以 2。我们可以对其应用任何功能。现在，我只是将每个元素乘以 2。
const Array = [1, 2, 4, 5, 6]
Array.map(x => x * 2 )
// output : 2
// 4
// 8
// 10
// 12 3、filter()
array.filter() 方法将一个函数作为参数，并返回一个新数组，其中，包含原始数组中与我们在参数中传递的元素相匹配的元素。其余元素被过滤掉。
当你想使用在函数中传递的特定元素filter()数组时，此方法很有用。
让我们通过一个简单的例子来理解这个方法。我们已经声明了一个有 5 个名字的数组。这些名称可以重复或不同。
const array=["Dawn", "Sam", "Eve", "John", "John"] 我们需要从数组中过滤掉名字“John”。我们想要一个只有“John”的数组。
const array=["Dawn", "Sam", "Eve", "John", "John"]
array.filter(element => element === "John")
//output : [John, John] 4、find()
array.find() 方法接受一个函数作为参数，并返回在数组中找到的满足测试函数的元素的值。否则，如果未找到测试值，它将返回 Undefined 作为输出。
需要一些例子来理解这一点吗？假设我们有一个包含关键字和值的数组。关键字表示员工姓名，值将是他们的薪水。
const array=[
{name1:"John", salary:10000},
{name2:"Andrew", salary:25000},
{name3:"Tom", salary:10000}
] 而你的要求是找到工资为 10,000 美元的员工。
const array=[
{name1:"John", salary:10000},
{name2:"Andrew", salary:25000},
{name3:"Tom", salary:50000}
]
array.find(elements => elements.salary=10000) 惊人的！我们传递一个函数，在该函数中，我们试图找到 10,000 的工资。如果它存在于数组中，它将输出带有关键字和值的内容部分。如果没有，它将简单地返回 undefined。
当你想在具有数千或数百万个元素的大型数组中查找值时，此 find 方法会派上用场。
5、findIndex()
如果你理解了 find 方法，那么你就会很容易理解这个方法。array.findIndex() 方法的工作方式与 find 方法相同，但它不返回值，而是返回数组中值的索引。简单来说，它输出元素在数组中的位置。
当你要查找数组中元素的索引时，此方法很有用。你想知道元素出现在哪个位置，并据此执行你未来的代码逻辑。
一个示例将帮助你清除此方法。假设我们有一个包含 20 个随机数的数组。
const array=[ 10, 6, 54, 67, 87, 89, 45, 83, 123, 90, 345, 346, 21, 56, 78, 30, 341, 98, 99, 100] 我们的任务是找到数字 123 的位置。
const array=[ 10, 6, 54, 67, 87, 89, 45, 83, 123, 90, 345, 346, 21, 56, 78, 30, 341, 98, 99, 100]
array.findIndex(elements => elements===123)
//output : 8
array.findIndex(elements => elements===101)
//output : -1 现在，你可以了解 findIndex 方法的工作原理了。它返回 8 作为输出，我们知道 123 出现在数组的第 8 个索引处。如果没有找到数字，与返回 undefined 的 find 方法不同，findIndex 方法返回 -1，它不代表任何索引。
6、sort()
array.sort() 只是将一个函数作为参数并返回一个已排序的数组。当你想对数组重新排序时，此方法非常方便。
为了理解排序方法，假设你有一个由 20 个无序随机数组成的数组。
const array=[ 10, 6, 54, 67, 87, 89, 45, 83, 123, 90, 345, 346, 21, 56, 78, 30, 341, 98, 99, 100] 你的要求是按升序重新排列数组中的数字。
const array=[ 10, 6, 54, 67, 87, 89, 45, 83, 123, 90, 345, 346, 21, 56, 78, 30, 341, 98, 99, 100]
array.sort()
//output : [ 10, 100, 123, 21, 30, 341, 345, 346, 45, 54, 56, 6, 67, 78, 83, 87, 89, 90, 98, 99 ] sort 方法不仅适用于数字，而且在按字母顺序对字符串进行排序时也很有用。让我们假设一个场景，我们要按字母顺序对 5 个名字进行排序。
const array=["John", "Evie", "Alex", "Ryan", "Sam"]
array.sort()
//output : [ "Alex", "Evie", "John", "Ryan", "Sam" ] 7、includes()
此方法不接受任何函数，而是将一个元素作为参数，并根据该值是否存在于该特定数组中来输出 true 或 false。
当数组中有一堆元素并且你想检查该数组中是否存在特定元素时，此方法很有用。显然，我们可以使用 find 或 findIndex 方法。但有时，我们只需要执行知道元素是否存在于数组中的简单任务。
我们将举一个例子来理清我们的概念。我们有一系列包含姓名和职业的数据。
const array=[ "Computer Scientist", "Programmer", "AI Expert", "Web Developer", "App Developer", "White Hacker"] 我们的任务是找出“Programmer”是否存在于数组中。
const array=[ "Computer Scientist", "Programmer", "AI Expert", "Web Developer", "App Developer", "White Hacker"]
array.includes("Programmer")
//output : true 8、forEach()
此方法将函数作为参数，并返回与提供元素数组中的关键字匹配的元素列表。
是的，当你想使用键查找元素时，此方法对字典数组特别有用。假设有一个带有id 和 name 的数据数组。
const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Downey" },
{ id: 3, name: "Karlo" },
{ id: 4, name: "Harry" },
] 现在，我们需要与数组中的名称键关联的所有值的输出。
const array = [
{ id: 1, name: "john" },
{ id: 2, name: "Downey" },
{ id: 3, name: "Karlo" },
{ id: 4, name: "Harry" },
]
array.forEach(element => console.log(element.name))
//output : John
// Downey
// Karlo
// Harry 9、concat()
array.concat() 方法将另一个数组而不是任何函数或元素作为参数，并返回一个合并的数组。当我们想要将两个数组合并为一个时，此方法很有用。
例如，假设我们有 2 个包含数字的数组。
const array1 = [1, 2, 3, 4, 5]
const array2 = [6, 7, 8, 9, 10] 现在，我们的任务是将 array1 与 array2 合并。
const array1 = [1, 2, 3, 4, 5]
const array2 = [6, 7, 8, 9, 10]
array1.concat(array2)
//output : [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ] 结论
希望你从这篇文章中学到了一些有用的东西。JavaScript 中还有许多其他数组方法。你现在可以查看它们，因为你已经了解了数组方法。
感谢你的阅读。
学习更多技能
请点击下方公众号