npm 包 array-includes-x 使用教程

阅读时长 3 分钟读完

简介

在前端开发中,遇到需要判断数组中是否包含某个元素的情况是很常见的。而 ES7 中的数组新方法 includes() 解决了这个问题,但是在一些老版本浏览器中并不支持,因此我们可以使用 npm 包 array-includes-x 来进行兼容性处理。

本篇文章将介绍如何使用 array-includes-x 这个 npm 包。

安装

在命令行中输入以下代码进行安装:

使用

使用 array-includes-x 的方法非常简单,只需要在使用时引入即可。下面是一个简单的示例:

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

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

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

参数介绍

array-includes-x 的使用非常简单,只有两个参数。接下来我们来简单介绍一下这两个参数:

  1. arr:要进行判断的数组。
  2. el:要查找的元素。

返回值

如果数组中包含要查找的元素,则返回 true,否则返回 false

示例代码

下面是一个更加详细的示例代码,我们来一步一步看一下它是如何运行的:

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

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

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

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

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

在上面的示例代码中,我们首先创建了一个包含四个元素的数组 arr,然后使用 includes() 判断是否包含元素 3。由于 arr 中确实包含元素 3,所以返回 true

然后我们又使用了 includes() 判断了数组中不包含元素 5,返回 false

接下来我们对一个包含 NaN 的数组进行判断,使用 includes(arr2, NaN) 进行测试,返回 true

最后我们对一个空数组 arr3 进行判断,由于 arr3 中的元素都是 undefined,所以可以用 includes(arr3, undefined) 进行判断,返回 true。而当我们使用 includes(arr3, 'str') 进行判断时,由于 arr3 中并不包含字符串类型的元素,所以返回 false

总结

array-includes-x 这个 npm 包可以很好地解决一些老版本浏览器中不支持 ES7 的 includes() 方法的问题,而且使用非常简单,非常适合初学者进行学习和使用。希望本篇文章能对大家有所帮助。

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

纠错
反馈

纠错反馈