js的Object.assign用法示例分析

1. 简介

Object.assign 是 ES6 新增的一个API，能够将一个或多个源对象的属性复制到目标对象上。它的参数依次为目标对象和一个或多个源对象。如果源对象中的属性已经存在在目标对象中，那么源对象中的属性值将覆盖目标对象中的属性值。

1. 语法

Object.assign(target, ...sources)

参数：

• target (必须)：要将源对象复制到的目标对象。
• sources (必须)：一个或多个源对象，该对象将被复制到目标对象。如果要复制多个源对象，请将它们放在逗号后面。

返回值：目标对象。

例如，如果需要将 obj2 和 obj3 中的属性分别复制到 obj1 中，可以这么调用：

Object.assign(obj1, obj2, obj3);

1. 示例1：深拷贝一个对象

const source = {
  name: '小明',
  age: 18,
  address: {
    city: '北京',
    street: '海淀区',
    code: '100000',
  },
};

const target = Object.assign({}, source);

console.log(target);

结果：

{
  "name": "小明",
  "age": 18,
  "address": {
    "city": "北京",
    "street": "海淀区",
    "code": "100000"
  }
}

解释：在这个示例中，源对象是一个嵌套的对象，它包含一个内部对象，通过 Object.assign() 方法将其赋值给一个新的空对象，实现了深拷贝。

1. 示例2：对象属性的合并

const target = {
  name: '小明',
  age: 18,
};

const source1 = {
  age: 19,
  address: '北京',
};

const source2 = {
  email: '[e-mail]',
};

Object.assign(target, source1, source2);

console.log(target);

结果：

{
  "name": "小明",
  "age": 19,
  "address": "北京",
  "email": "[e-mail]"
}

解释：在这个示例中，目标对象有两个属性：name 和 age。源对象 1 有两个属性：age 和 address。源对象 2 有一个属性：email。通过 Object.assign() 方法将所有的源对象合并到目标对象的属性中，属性值按照顺序依次覆盖。