在前端开发中，我们有时候需要把一个对象的属性合并到另一个对象中去。在继承、数据合并、参数配置等方面都经常需要使用。Javascript 提供了一个原生方法 Object.assign()，它可以将一个或多个源对象的可枚举属性复制到目标对象中。不过 Object.assign() 存在一些限制，比如不会拷贝源对象的原型链上的属性、不会对对象的 getter 和 setter 进行拷贝等。
这时我们可以使用一个 npm 包 assign-object 来解决这些问题。
安装
你可以通过 npm 命令安装 assign-object 包：
--- ------- -------------
安装完毕后，我们就可以在代码中使用它了。
使用
假设我们有一个目标对象 target 和两个源对象 source1、source2，我们想要将 source1 和 source2 的属性合并到 target 中。
首先，我们先使用原生 Object.assign() 方法来合并
----- ------ - -- ----- ------- - - -- -- -- - - ----- ------- - - -- -- -- - - --------------------- -------- -------- ------------------- -- - -- -- -- -- -- - -
可以看到，Object.assign() 方法把两个源对象的属性合并到了目标对象中，相同属性名的值会被后面的覆盖掉。
然后，我们来看 assign-object 的使用方法
----- - ------------ - - ------------------------ ----- ------ - -- ----- ------- - - -- -- -- - - ----- ------- - - -- -- -- - - -------------------- --------- --------- ------------------- -- - -- -- -- -- -- - -
assignObject() 方法接受三个参数，分别是目标对象 target 和一个数组 sources，数组中的每个元素都是源对象。同样地，相同属性名的值会被后面的覆盖掉。
深度合并
assign-object 还可以进行深度合并，也就是将对象中的属性递归合并到目标对象中去。比如下面这个例子：
----- - ------------ - - ------------------------ ----- ------ - - ---- - ---- - - - ----- ------- - - ---- - ---- - - - ----- ------- - - ---- - - -------------------- --------- --------- ----- ------------------- -- - ---- - ---- -- ---- - -- ---- - -
这里使用了第三个可选参数 isDeep，用来指定是否进行深度合并。当 isDeep 为 true 时，assign-object 将会递归处理源对象的属性，直到所有源对象的所有属性都合并到目标对象中去。
指定属性名称
默认情况下，assign-object 会复制源对象的所有可枚举属性到目标对象中。如果你只想复制源对象中的部分属性，可以使用第四个可选参数，它接受一个字符串数组，数组中的元素代表要拷贝的属性名。
----- - ------------ - - ------------------------ ----- ------ - -- ----- ------ - - -- -- -- -- -- - - -------------------- --------- ------ ----- ----- ------------------- -- - -- -- -- - -
总结
assign-object 是一个非常实用的 npm 包，可以解决 Object.assign() 方法在合并对象时的一些限制，而且还可以进行深度合并和指定属性名称等操作。如果你在开发中需要合并对象，却又不想受到这些限制，可以尝试使用 assign-object。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600557b581e8991b448d4be2