在前端开发中，常常需要对数组进行操作，其中一个常见的需求是检查一个元素是否存在于数组中。在 ES2020 中，提供了一种新的方式来快速检查元素是否存在于数组中，本文将详细介绍这种方法的使用和优势。
includes() 方法
ES2020 中新增了一个数组方法 includes()，用于检查一个元素是否存在于数组中。该方法返回一个布尔值，表示数组中是否包含传入的元素。其语法如下：
array.includes(searchElement[, fromIndex])
其中，searchElement 表示要查找的元素，fromIndex 是可选参数，表示从哪个索引开始查找，默认值为 0。
下面是一个示例代码：
const arr = [1, 2, 3, 4, 5]; console.log(arr.includes(3)); // true console.log(arr.includes(6)); // false
通过调用 includes() 方法，我们可以快速地检查一个元素是否存在于数组中，并获得一个布尔值作为结果。
indexOf() 方法
在 ES2020 之前，我们通常使用 indexOf() 方法来检查一个元素是否存在于数组中。该方法返回一个数字，表示元素在数组中的索引位置。如果元素不存在于数组中，则返回 -1。其语法如下：
array.indexOf(searchElement[, fromIndex])
其中，searchElement 表示要查找的元素，fromIndex 是可选参数，表示从哪个索引开始查找，默认值为 0。
下面是一个示例代码：
const arr = [1, 2, 3, 4, 5]; console.log(arr.indexOf(3)); // 2 console.log(arr.indexOf(6)); // -1
通过调用 indexOf() 方法，我们可以得到元素在数组中的索引位置，如果元素不存在于数组中，则返回 -1。但是，这种方法的缺点是，如果数组中存在重复的元素，它只能返回第一个匹配的元素的索引位置。
includes() 方法的优势
相比于 indexOf() 方法，includes() 方法有以下优势：
includes()方法返回一个布尔值，更加直观和易于理解。includes()方法可以正确处理 NaN 和 -0，而indexOf()方法不能正确处理。includes()方法可以正确处理数组中存在的重复元素。
下面是一个示例代码，演示了 includes() 方法的优势：
const arr = [1, 2, NaN, -0, 3, 4, 5, NaN]; console.log(arr.includes(NaN)); // true console.log(arr.includes(-0)); // true console.log(arr.indexOf(NaN)); // -1 console.log(arr.indexOf(-0)); // 0
总结
在 ES2020 中，新增了一个数组方法 includes()，用于快速检查一个元素是否存在于数组中。相比于之前常用的 indexOf() 方法，includes() 方法更加直观易懂，能够正确处理 NaN 和 -0，以及数组中存在的重复元素。在实际开发中，我们可以根据具体需求选择使用 includes() 方法或 indexOf() 方法来检查数组中的元素。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65c34bc8add4f0e0ffd87363