ES7 的 includes 将取代 indexOf 作为判断数组中是否存在的首选方法

在 JavaScript 编程中，经常需要判断一个元素是否存在于数组中。在 ES6 之前，我们通常使用 indexOf 方法来实现这种功能。但是，在 ES7 中，引入了 includes 方法，它取代了 indexOf，成为了判断数组中是否存在某个元素的首选方法。

indexOf 方法的缺陷

在 ES6 之前，我们通常使用 indexOf 方法来判断一个元素是否存在于数组中。例如：

let arr = [1, 2, 3, 4];

if (arr.indexOf(3) !== -1) {
  console.log('存在');
}

上面代码中，如果数组 arr 中存在元素 3，则会输出 '存在'。

然而，indexOf 方法有一个缺陷，即它无法判断数组中是否存在 NaN 元素。例如：

let arr = [1, 2, NaN, 4];

if (arr.indexOf(NaN) !== -1) {
  console.log('存在');
}

上面代码中，数组 arr 中存在 NaN 元素，但是 indexOf 方法返回的是 -1，导致判断出错。

includes 方法解决了 NaN 的问题

ES7 中引入了 includes 方法，它可以判断一个元素是否存在于数组中。例如：

let arr = [1, 2, 3, 4];

if (arr.includes(3)) {
  console.log('存在');
}

上面代码中，如果数组 arr 中存在元素 3，则会输出 '存在'。

与 indexOf 方法相比，includes 方法的优势在于它可以正确地判断数组中是否存在 NaN 元素。例如：

let arr = [1, 2, NaN, 4];

if (arr.includes(NaN)) {
  console.log('存在');
}

上面代码中，数组 arr 中存在 NaN 元素，而 includes 方法返回的是 true，判断正确。

includes 方法的语法

includes 方法的语法如下：

array.includes(searchElement, fromIndex)

参数说明：

• searchElement：要查找的元素。
• fromIndex：可选参数，从数组的哪个索引位置开始查找。

includes 方法返回一个布尔值，表示数组中是否包含指定的元素。

使用 includes 方法代替 indexOf 方法

由于 includes 方法可以正确地判断数组中是否存在 NaN 元素，因此推荐在日常编程中使用 includes 方法代替 indexOf 方法。例如：

let arr = [1, 2, 3, 4];

if (arr.includes(3)) {
  console.log('存在');
}

上面代码中，如果数组 arr 中存在元素 3，则会输出 '存在'。

let arr = [1, 2, NaN, 4];

if (arr.includes(NaN)) {
  console.log('存在');
}

上面代码中，如果数组 arr 中存在 NaN 元素，则会输出 '存在'。

总结

在 ES7 中，includes 方法取代了 indexOf 方法，成为了判断数组中是否存在某个元素的首选方法。与 indexOf 方法相比，includes 方法可以正确地判断数组中是否存在 NaN 元素，因此推荐在日常编程中使用 includes 方法代替 indexOf 方法。

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