ECMAScript 2018 中的 Array.prototype.includes 方法解决 NaN 判断问题

阅读时长 5 分钟读完

在 JavaScript 中,当我们需要判断一个值是否为 NaN 时,通常会使用 isNaN 方法。然而,该方法有着一些不太符合直觉的行为,例如对于非数字类型的值会返回 true。为此,ECMAScript 2018 中新增了 Array.prototype.includes 方法,可以更好地解决这一问题。本文将对该方法进行详细解释,并提供一些指导意义和示例代码。

Array.prototype.includes 方法介绍

Array.prototype.includes 方法用于判断一个数组中是否包含某个元素,其语法如下:

其中,valueToFind 参数表示要查找的元素值,fromIndex 参数表示起始查找位置的索引值(可选)。该方法将返回一个布尔值,表示是否找到了该元素。

需要注意的是,Array.prototype.includes 方法和 Array.indexOf 方法有一些不同之处。Array.indexOf 方法返回匹配元素的索引值,如果查找不到则返回 -1,而 Array.prototype.includes 方法返回布尔值。此外,Array.prototype.includes 方法还有一个特殊之处,即可以正确处理 NaN 值。

Array.prototype.includes 方法解决 NaN 判断问题

当我们使用 isNaN 方法判断一个值是否为 NaN 时,实际上是判断该值是否无法转换为数字。以下几种情况会被判断为 true:

-- -------------------- ---- -------
-----------              -- ----
----------                -- ----
-----------------        -- ----
------------             -- ------------- --
------------             -- ------------- --
-------------            -- ------------- --
---------------           -- -------------
--------- --------        -- ---------------
--------- -------------   -- --------------
展开代码

可以看到,isNaN 方法返回 true 的情况包括了一些不太符合直觉的值,例如空字符串、undefined 和 null 等。此外,对于 NaN 值的判断也不是十分可靠。例如,以下代码会输出 true,但实际上 Number('foo') 的值并不是 NaN:

为了解决这一问题,ECMAScript 2018 中新增了 Array.prototype.includes 方法,可以正确地处理 NaN 值。例如,以下代码会输出 false:

需要注意的是,Array.prototype.includes 方法的使用范围仅限于数组,不能用于其他类型的判断。

指导意义

Array.prototype.includes 方法的引入,不仅解决了 NaN 值判断的问题,也为我们提供了一种更直观和可读性更高的数组元素查找方法。

在使用该方法时,可以结合 ES6 中的解构赋值和默认参数等语法,实现更加简洁和优雅的代码。例如:

-- -------------------- ---- -------
----- --- - --- -- -- -- ---
----- ------- ------- - ------- - ----
------------------ ------- --------   -- - - -

-------- ------- - --- -
  -- ----------------- -
    ------------------ - -- --------
  -
-
------- -- -- -- ----   -- ----- - -- -----
------                  -- ------
展开代码

示例代码

以下是使用 Array.prototype.includes 方法判断数组中是否包含某个元素的示例代码:

-- -------------------- ---- -------
----- --- - --- -- -- -- -----
-- ----------------- -
  ------------------ - -- --------
-
-- ------------------ -
  -------------- --- ----- -- --------
-
-- ------------------- -
  ------------------ --- -- --------
-
展开代码

注意,Array.prototype.includes 方法是一个 ES2016/ES7 中的新特性,需要在较新的浏览器或 Node.js 版本中使用。如果需要在旧版本的 JavaScript 环境中使用该方法,可以使用 polyfill(如 babel-polyfill)等实现。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67c15f46314edc2684965373

纠错
反馈

纠错反馈

程序员教程

精选优质教程,助你快速提升技术实力

程序员面试题库

海量优质面试题,助你轻松应对技术面试