在前端开发中，处理数组是经常遇到的需求。而 lodash 是一个非常优秀的 JavaScript 工具库，其中就包含了一个十分实用的方法 union。
什么是 union
union 方法可以接受多个数组参数，并返回这些数组的并集，去除重复元素后的新数组。
安装 lodash
要使用 union 方法，我们需要先安装 lodash 这个 npm 包。在终端中输入以下命令即可：
--- ------- ------
使用 union 方法
安装好 lodash 后，我们就可以在项目中使用 union 方法来对数组进行操作。
基础用法
下面我们来看一个简单的示例代码：
----- - - ------------------ ----- ---- - --- -- --- ----- ---- - --- -- --- ----- ------ - ------------- ------ -------------------- -- --- -- -- --
在上面的代码中，我们首先引入了 lodash，然后定义了两个数组 arr1 和 arr2。接着，我们调用了 _.union 方法，将 arr1 和 arr2 作为参数传入。最后，将结果赋值给变量 result 并输出。
运行代码后，我们会得到 [1, 2, 3, 4] 这个新的数组。可以看到，这是 arr1 和 arr2 的并集，并且去除了重复元素。
多重数组的并集
除了可以传入两个数组，union 方法还可以接受多个数组作为参数，并返回它们的并集。
----- - - ------------------ ----- ---- - --- -- --- ----- ---- - --- -- --- ----- ---- - --- -- --- ----- ------ - ------------- ----- ------ -------------------- -- --- -- -- -- --
在上面的代码中，我们定义了三个数组 arr1、arr2 和 arr3。然后，将它们传入 union 方法中，得到了一个包含所有元素的新数组 [1, 2, 3, 4, 5]。
对象数组的合并
有时候，我们需要对包含对象的数组进行操作。在这种情况下，我们可以使用 _.unionBy 方法，通过指定对象属性来去重合并数组。
----- - - ------------------ ----- ---- - ----- --- ---- ---- ----- ---- - ----- --- ---- ---- ----- ------ - --------------- ----- ------ -------------------- -- ----- --- ---- --- ---- ---
在上面的代码中，我们定义了两个包含对象的数组 arr1 和 arr2。然后，通过指定 id 属性，调用了 _.unionBy 方法，得到了一个包含所有元素的新数组 [{id: 1}, {id: 2}, {id: 3}]。
数组中包含 NaN
在 JavaScript 中，NaN 和任何值都不相等。如果数组中包含 NaN，那么使用 union 方法就无法正确去重合并数组。
为了解决这个问题，lodash 提供了一个特殊的方法 _.unionWith，可以自定义比较函数来进行数组合并。
下面是一个示例：
----- - - ------------------ ----- ---- - --- ---- --- ----- ---- - ----- -- --- ----- ------ - ----------------- ----- ----------- -------------------- -- --- ---- -- -- --
在上面的代码中，我们定义了两个数组 arr1 和 arr2，其中 arr1 包含了一个 NaN 元素。然后，通过调用 _.unionWith 方法，并传入 isEqual 比较函数，得到了一个包含所有元素的新数组
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/49270