在 JavaScript 中,当我们需要判断一个值是否为 NaN 时,通常会使用 isNaN
方法。然而,该方法有着一些不太符合直觉的行为,例如对于非数字类型的值会返回 true。为此,ECMAScript 2018 中新增了 Array.prototype.includes
方法,可以更好地解决这一问题。本文将对该方法进行详细解释,并提供一些指导意义和示例代码。
Array.prototype.includes 方法介绍
Array.prototype.includes
方法用于判断一个数组中是否包含某个元素,其语法如下:
array.includes(valueToFind[, fromIndex])
其中,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:
const val = Number('foo'); console.log(isNaN(val)); // true
为了解决这一问题,ECMAScript 2018 中新增了 Array.prototype.includes
方法,可以正确地处理 NaN 值。例如,以下代码会输出 false:
const arr = [1, 2, NaN, 4]; console.log(arr.includes(NaN)); // true
需要注意的是,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