一、前言
Object.assign 方法是 ES6 中一个非常实用且方便的对象操作方法，可以用来合并对象或者为对象设置属性。在前端开发中，我们经常会使用它来完成一些常见的操作，比如合并配置对象，合并初始值等。接下来，我们就来详细介绍一下 Object.assign 方法的使用技巧。
二、Object.assign的简介
Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它接受两个或多个参数，第一个参数是目标对象，后面的参数都是源对象。方法会返回目标对象。
语法：
Object.assign(target, ...sources)
- 参数 target：目标对象。
- 参数 sources：源对象。如果有多个源对象，则每个源对象的属性都会被复制到目标对象中。
三、合并对象
合并对象是 Object.assign 最常见的用法.我们来看一个示例代码：
-- -------------------- ---- ------- ----- --------- - - ----- ----- ---- -- -- ----- --------- - - ----- ----- ---- --- -- ------------------------ ----------- ----------------------- -- - ----- ----- ---- --- ---- --- -
在这个示例代码中，我们定义了一个目标对象 targetObj 和一个源对象 sourceObj，然后调用了Object.assign() 方法将 sourceObj 对象的属性都合并到了目标对象 targetObj 中。最后输出合并后的目标对象，我们可以看到，目标对象中的 name 属性值已经被 sourceObj 中的值覆盖了。这是因为 Object.assign() 只会复制源对象中存在的属性。
四、为对象添加属性
有时候，我们需要为一个对象添加一个或多个新的属性。我们可以使用 Object.assign() 来实现这个功能。我们来看一个示例代码：
const person = {
name: '张三',
age: 20
};
Object.assign(person, {sex: '男', hobby: '篮球'});
console.log(person); // { name: '张三', age: 20, sex: '男', hobby: '篮球' }在这个示例代码中，我们定义了一个 person 对象，然后调用了Object.assign() 方法为 person 对象添加了两个新的属性，sex 和 hobby。最后输出 person 对象，我们可以看到，person 对象中已经添加了这两个新的属性。
需要注意的是：如果目标对象中已经存在同名属性，那么新属性会覆盖旧属性。
五、将多个对象合并为一个新对象
有时候，我们需要将多个对象合并为一个新对象，可以通过 Object.assign() 方法来实现。我们来看一个示例代码：
-- -------------------- ---- ------- ----- --------- - --- ----- ------- - - ----- ----- ---- -- -- ----- ------- - - ----- ----- ---- --- -- ----- ------- - - ----- ----- ------ ---- -- ------------------------ -------- -------- --------- ----------------------- -- - ----- ----- ---- --- ---- ---- ------ ---- -
在这个示例代码中，我们定义了一个 targetObj 对象和三个 person1，person2 和 person3 对象。然后调用了 Object.assign() 方法将这三个对象合并到了 targetObj 对象中。最后输出 targetObj 对象，我们可以看到三个源对象中的属性都被合并到了目标对象 targetObj 中。
需要注意的是：如果源对象中存在相同属性，则后面的属性会覆盖前面的属性。
六、结论
通过本文的介绍，我们了解了如何使用 Object.assign() 方法合并对象、为对象添加属性以及将多个对象合并为一个新对象。无论是在开发过程中的配置合并，还是为对象动态添加属性，Object.assign() 都是非常实用的工具方法。希望本文对大家在前端开发中的实践有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67138bd8ad1e889fe20e06ca