在 JavaScript 中，Array.includes() 函数是一个方便的方法，可以用于检查数组中是否存在某个元素。这个函数在 ES7 中被引入，它可以帮助我们更轻松地处理数组，同时也可以避免一些常见的错误。
在本文中，我们将深入探讨 ES7 中的 Array.includes() 函数，包括如何正确使用它、如何避免常见错误以及如何在实际项目中应用它。
什么是 Array.includes() 函数
Array.includes() 函数是 JavaScript 中的一个方法，它用于检查数组中是否包含某个元素。这个函数在 ES7 中被引入，它可以方便地替换掉 indexOf() 函数，同时也可以避免一些常见的错误。
Array.includes() 函数的语法如下：
array.includes(searchElement[, fromIndex])
其中，searchElement 表示要查找的元素，fromIndex 表示要从哪个索引开始查找。如果省略 fromIndex 参数，则默认从数组的第一个元素开始查找。
Array.includes() 函数的返回值是一个布尔值，表示数组中是否包含指定的元素。
如何正确使用 Array.includes() 函数
使用 Array.includes() 函数非常简单。我们只需要传入要查找的元素作为参数，它就会返回一个布尔值。
下面是一个示例代码：
const arr = [1, 2, 3, 4, 5]; const hasThree = arr.includes(3); console.log(hasThree); // true
在上面的代码中，我们定义了一个数组 arr，然后使用 Array.includes() 函数检查数组中是否包含数字 3。由于数组中确实包含数字 3，因此函数返回 true。
如何避免常见错误
在使用 Array.includes() 函数时，有一些常见的错误需要避免。
1. 混淆参数顺序
在使用 Array.includes() 函数时，我们需要注意参数的顺序。函数的第一个参数应该是要查找的元素，而第二个参数应该是要从哪个索引开始查找。
下面是一个错误示例代码：
const arr = [1, 2, 3, 4, 5]; const hasThree = arr.includes(2, 3); console.log(hasThree); // false
在上面的代码中，我们将要查找的元素 2 放在了第二个参数的位置，而将要从哪个索引开始查找的参数 3 放在了第一个参数的位置。这会导致函数返回 false，因为它从索引 2 开始查找，而不是查找元素 2。
2. 混淆返回值
Array.includes() 函数的返回值是一个布尔值，表示数组中是否包含指定的元素。但是，有时候我们可能会混淆这个返回值。
下面是一个错误示例代码：
const arr = [1, 2, 3, 4, 5]; const index = arr.includes(3); console.log(index); // true
在上面的代码中，我们将 Array.includes() 函数的返回值存储在了一个变量 index 中。但是，这个变量的名字可能会让我们混淆，因为它实际上存储的是一个布尔值，而不是一个索引值。
如何在实际项目中应用 Array.includes() 函数
在实际项目中，我们可以使用 Array.includes() 函数来检查数组中是否包含某个元素。这个函数在处理一些常见的场景时非常有用。
下面是一个示例代码：
const fruits = ['apple', 'banana', 'orange'];
const isFruit = (fruit) => fruits.includes(fruit);
console.log(isFruit('apple')); // true
console.log(isFruit('grape')); // false在上面的代码中，我们定义了一个 fruits 数组，它包含了一些水果的名称。然后，我们定义了一个 isFruit 函数，它接受一个参数 fruit，用于检查 fruits 数组中是否包含这个水果。我们可以多次调用这个函数，以检查不同的水果是否在 fruits 数组中。
结论
Array.includes() 函数是一个非常方便的方法，可以用于检查数组中是否包含某个元素。在使用这个函数时，我们需要注意参数的顺序，并避免混淆返回值。在实际项目中，我们可以使用这个函数来处理一些常见的场景，从而提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6745f0d3f84d1ff1034d99b8