如何在 ES7 中使用 Array.prototype.includes() 方法-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们通常需要对数组进行操作和判断，其中包括判断数组中是否包含某个元素。在过去，我们需要使用 indexOf() 方法来检查数组，但是这个方法并不够灵活，无法处理一些特殊情况。ES7 中引入了新的 Array.prototype.includes() 方法，来更方便地判断数组中是否包含某个元素。

Array.prototype.includes() 方法的使用

使用 Array.prototype.includes() 方法非常简单，只需要传入要检查的元素，该方法就会判断该元素是否在数组中存在。该方法返回一个布尔值，如果找到了该元素，就返回 true，否则返回 false。

下面是一个简单的示例：

const arr = [1, 2, 3, 4, 5];
console.log(arr.includes(3)); // true
console.log(arr.includes(6)); // false

Array.prototype.includes() 方法的优势

相比较于传统的 indexOf() 方法，Array.prototype.includes() 方法更加灵活，可以处理一些特殊情况。下面是一些 Array.prototype.includes() 方法的优势：

1. 处理 NaN

indexOf() 方法无法判断数组中的 NaN，因为 NaN 在自身比较中始终为 false。但是，Array.prototype.includes() 方法可以正确地识别 NaN。

const arr = [1, 2, NaN, 4, 5];
console.log(arr.includes(NaN)); // true
console.log(arr.indexOf(NaN)); // -1

2. 处理数组中包含 undefined 的情况

当使用 indexOf() 方法判断数组中是否包含 undefined 时，可能会出现错误的结果。因为 indexOf() 方法不能识别 undefined，如果数组中包含 undefined，会返回 0，这可能会导致错误的结果。而 Array.prototype.includes() 方法则可以正确处理数组中包含 undefined 的情况。

const arr = [1, 2, undefined, 4, 5];
console.log(arr.includes(undefined)); // true
console.log(arr.indexOf(undefined)); // 2

3. 不需要手动检查返回值

使用 indexOf() 方法检查数组时，我们必须手动检查返回值是否为 -1，否则可能会导致错误的结果。而 Array.prototype.includes() 方法会自动返回布尔值，让我们更加方便地使用。

使用 Array.prototype.includes() 方法的注意事项

使用 Array.prototype.includes() 方法的时候，需要注意以下几点：

1. ES7 浏览器支持度问题

由于 Array.prototype.includes() 方法是在 ES7 中引入的，因此在某些旧版本浏览器中可能不被支持。在使用之前，请先确认该方法是否被当前环境支持。

2. 对象的判断

Array.prototype.includes() 方法仅仅判断元素的值，而不会判断对象的引用是否相等。如果你需要检查对象的相等性，应该使用其他检查对象引用的方法。

结论

如果你想轻松地判断一个元素是否在数组中，或者需要在数组中寻找复杂的元素，Array.prototype.includes() 方法是你的最佳选择。这个方法可以处理一些特殊情况，使我们更加方便地操作数组。随着 ES7 的普及，这个方法会更加常见，如果你还没有使用过该方法，赶紧试试吧！

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/6705ef70d91dce0dc855f418