ECMAScript 2016 新特性：Array.prototype.includes() 方法

在 ECMAScript 2016 中，新增了 Array.prototype.includes() 方法，该方法用于判断一个数组是否包含某个元素。该方法是对 ES5 中 Array.prototype.indexOf() 方法的补充，它解决了 indexOf() 方法的一些不足之处，同时也更加简单易用。

语法

arr.includes(searchElement[, fromIndex])

• searchElement：要搜索的元素。
• fromIndex：可选参数，搜索的起始位置。如果省略该参数，则从数组的起始位置开始搜索。如果该参数是负数，则从数组的末尾开始搜索。

返回值

如果数组中包含指定的元素，则返回 true，否则返回 false。

示例代码

const arr = [1, 2, 3, 4, 5];

console.log(arr.includes(2)); // true
console.log(arr.includes(6)); // false
console.log(arr.includes(2, 2)); // false
console.log(arr.includes(2, -3)); // true

从示例代码中可以看出，includes() 方法非常简单易用，可以轻松地判断一个数组是否包含指定的元素。

深入理解

与 indexOf() 方法相比，includes() 方法的优势在于，它可以正确地处理 NaN 值和 -0 值。在 indexOf() 方法中，如果数组中包含 NaN 值或者 -0 值，会出现一些问题。

处理 NaN 值

在 indexOf() 方法中，如果数组中包含 NaN 值，则无法正确地判断，因为在 JavaScript 中，NaN 不等于任何值，包括它自己。例如：

const arr = [1, 2, NaN, 4, 5];

console.log(arr.indexOf(NaN)); // -1

可以看到，indexOf() 方法无法正确地判断数组中是否包含 NaN 值。而 includes() 方法则可以正确地处理 NaN 值。例如：

const arr = [1, 2, NaN, 4, 5];

console.log(arr.includes(NaN)); // true

处理 -0 值

在 JavaScript 中，-0 和 +0 是不同的值，但是它们在一些情况下是相等的。在 indexOf() 方法中，如果数组中包含 -0 值，则无法正确地判断，因为 -0 和 +0 在 indexOf() 方法中被认为是相等的。例如：

const arr = [1, 2, -0, 4, 5];

console.log(arr.indexOf(+0)); // 2
console.log(arr.indexOf(-0)); // 2

可以看到，indexOf() 方法无法正确地判断数组中是否包含 -0 值。而 includes() 方法则可以正确地处理 -0 值。例如：

const arr = [1, 2, -0, 4, 5];

console.log(arr.includes(+0)); // true
console.log(arr.includes(-0)); // true

指导意义

Array.prototype.includes() 方法的出现，使得我们在判断一个数组是否包含某个元素时更加方便。同时，它也解决了 indexOf() 方法在处理 NaN 值和 -0 值时的问题，让我们的代码更加健壮。

在实际开发中，我们可以使用 includes() 方法来判断一个数组中是否包含某个元素，从而避免使用 indexOf() 方法时出现的一些问题。例如：

if (arr.includes('apple')) {
  // do something
}

同时，我们也可以使用 includes() 方法来判断一个数组中是否包含重复的元素，例如：

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

if (arr.length !== new Set(arr).size) {
  console.log('数组中包含重复的元素');
}

结论

Array.prototype.includes() 方法是 ECMAScript 2016 中的一个新特性，它用于判断一个数组是否包含某个元素。与 indexOf() 方法相比，includes() 方法更加简单易用，同时也可以正确地处理 NaN 值和 -0 值，让我们的代码更加健壮。在实际开发中，我们可以使用 includes() 方法来判断一个数组中是否包含某个元素，从而避免使用 indexOf() 方法时出现的一些问题。

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