ES6 中新加入的 Array 方法 includes 的用法详解与应用-JavaScript中文网-JavaScript教程资源分享门户

在 ES6 中，新增的 Array 方法 includes 可以用于判断一个数组是否包含某个指定的元素，并返回一个布尔值。本文将详细讲解 includes 方法的用法和应用，并提供示例代码供读者参考。

includes 方法的语法

includes 方法的语法非常简单，它只接受一个参数，即要搜索的元素，返回一个布尔值，表示数组中是否包含该元素。

array.includes(searchElement)

其中，array 表示要进行搜索的数组，searchElement 表示要搜索的元素。

includes 方法的应用

includes 方法主要用于判断一个数组中是否包含某个指定的元素。在实际开发中，我们经常需要根据数组中是否包含某个元素来执行不同的操作，这时候 includes 方法就非常有用了。

下面是一个示例代码，演示了如何使用 includes 方法来判断一个数组中是否包含某个元素：

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

if (arr.includes(3)) {
  console.log('数组中包含元素 3');
} else {
  console.log('数组中不包含元素 3');
}

上述代码中，我们首先定义了一个包含 5 个元素的数组 arr，然后使用 includes 方法判断数组中是否包含元素 3。如果包含，则输出“数组中包含元素 3”，否则输出“数组中不包含元素 3”。

除了用于判断数组中是否包含某个元素外，includes 方法还可以用于判断数组中是否包含 NaN。这是因为在 JavaScript 中，NaN 与任何值都不相等，包括它自己。如果使用 indexOf 方法来判断数组中是否包含 NaN，会得到错误的结果，而 includes 方法则可以正确地判断。

下面是一个示例代码，演示了如何使用 includes 方法来判断一个数组中是否包含 NaN：

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

if (arr.includes(NaN)) {
  console.log('数组中包含 NaN');
} else {
  console.log('数组中不包含 NaN');
}

上述代码中，我们定义了一个包含 5 个元素的数组 arr，其中第三个元素是 NaN。然后使用 includes 方法判断数组中是否包含 NaN。由于 includes 方法可以正确地判断 NaN，因此输出“数组中包含 NaN”。

includes 方法的兼容性

includes 方法是在 ES6 中新增的，因此在一些旧版本的浏览器中可能不支持。为了确保代码的兼容性，我们可以使用 polyfill 来模拟 includes 方法的行为。

下面是一个示例代码，演示了如何使用 polyfill 来模拟 includes 方法：

// javascriptcn.com 代码示例
if (!Array.prototype.includes) {
  Array.prototype.includes = function(searchElement) {
    for (let i = 0; i < this.length; i++) {
      if (this[i] === searchElement) {
        return true;
      }
    }
    return false;
  }
}

上述代码中，我们首先判断当前浏览器是否支持 includes 方法。如果不支持，则定义一个 includes 方法，使用 for 循环遍历数组，判断数组中是否包含指定的元素。如果包含，则返回 true，否则返回 false。

总结

includes 方法是 ES6 中新增的 Array 方法，可以用于判断一个数组中是否包含某个指定的元素，并返回一个布尔值。在实际开发中，我们可以根据 includes 方法的返回值来执行不同的操作，从而提高代码的灵活性和可读性。同时，我们也需要注意 includes 方法在不同浏览器中的兼容性，以确保代码的正确性。

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