ES7 提供 Array.prototype.includes() 方法的常见应用场景-JavaScript中文网-JavaScript教程资源分享门户

ES7 提供 Array.prototype.includes() 方法的常见应用场景

ES7标准中提供了 Array.prototype.includes() 方法，通过它可以对数组元素进行简单的值匹配，判断其中是否含有所需的元素。这个方法在前端开发中的应用场景较多，本文将介绍一些常见的实际案例。

数组中是否包含某一个元素是我们在日常开发中常常需要判断的问题，在 ES7 之前，我们需要采用 indexOf() 方法来判断，代码如下：

if (arr.indexOf(item) !== -1) {
  // 数组中包含该元素
}

在 ES7 中，我们可以使用 includes() 方法，使用它来实现元素是否存在的判断，代码如下：

if (arr.includes(item)) {
  // 数组中包含该元素
}

在 JavaScript 中，NaN 与任何值都不相等，因此，我们无法使用 indexOf()、==、=== 等方法对该值进行判断，但是使用 includes() 方法，我们可以轻松地判断数组是否包含 NaN，代码如下：

if (arr.includes(NaN)) {
  // 数组中包含 NaN 元素
}

在日常开发中，我们需要对某一个字符串进行匹配，判断字符串中是否包含某一个子串。在 ES7 中，我们可以利用 includes() 方法很容易地实现该功能，代码如下：

if (str.includes(subStr)) {
  // 字符串中包含该子串
}

在某些场景下，我们需要进行一些操作，例如验证输入框中的内容是否合法，如果不合法就需要进行某个行为，否则不作任何动作。在这种情况下，我们可以利用 includes() 方法来判断是否需要触发某个事件，代码如下：

if (arr.includes('error')) {
  // 需要触发错误提示等操作
} else {
  // 不需要触发操作
}

总结

Array.prototype.includes() 方法是 ES7 标准中的一个新方法，可用于判断数组中是否包含某个元素以及一些字符串的匹配等场景。它不仅可以简化代码，还可以提升代码性能。在实际开发场景中，我们需要结合具体情况进行合理运用。

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