利用 ES7 的 Array.prototype.includes 方法优雅地判断数组是否包含指定的值

阅读时长 3 分钟读完

在前端开发中,判断一个数组是否包含指定的值是非常常见的操作,通常会使用 indexOf 或 includes 方法来实现,其中,indexOf 方法返回查找到的元素在数组中的下标,如果没找到则返回 -1,而 includes 方法返回一个布尔值,表示数组中是否包含该元素。

在 ES7 中新增了 Array.prototype.includes 方法,可以方便地判断一个数组是否包含指定的值,而且代码也更加优雅。

方法介绍

Array.prototype.includes 方法用于判断一个数组是否包含一个指定的值。其语法如下:

其中,valueToFind 表示要查找的值,fromIndex 表示从数组中的哪个索引开始查找(可选参数),如果省略则默认从第一个元素开始查找。该方法返回一个布尔值,表示数组中是否包含该元素。

示例代码

下面是一个基本的使用示例,判断一个数组是否包含指定的值:

从上面的例子可以看出,通过 includes 方法可以非常简单地判断一个数组是否包含指定的值。

接下来我们再看一个例子,判断一个数组中是否存在指定的对象:

结果发现不符合预期,includes 方法返回了 false。这是为什么呢?

原因在于 includes 方法比较两个值是否相同时,使用的是 Object.is 方法进行比较,而不是使用全等运算符(===)。而 Object.is 方法比较的是两个值是否相同,而不是两个对象是否相等。

因此,上面的例子中,虽然我们提供的值和数组中的对象看起来相同,但它们实际上是不同的对象,Object.is 方法返回的结果就是 false。如果要比较对象是否相等,可以使用 lodash 库的 isEqual 方法或自己实现一个比较函数。

下面是一个利用 isEqual 方法实现的例子,判断一个数组中是否存在指定的对象:

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

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

总结

Array.prototype.includes 方法可以方便地判断一个数组是否包含指定的值,它的使用也非常简单,比 indexOf 或 includes 方法更加优雅和语义化。需要注意的是,该方法比较值的方式和全等运算符有一些差异,需要注意使用。在实际开发中,我们可以选择自己实现一个比较函数或使用 lodash 库的 isEqual 方法来比较两个对象是否相等。

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

纠错
反馈