跳到主要内容

JavaScript 对象 assign() 方法

Object.assign() 方法将给定对象的所有可枚举属性复制到单个对象中并返回它。

示例​

const obj1 = { a: 1 };
const obj2 = { b: 2 };
const obj3 = { c: 3 };

// 将 obj1、obj2、obj3 的所有属性
// 组合到单个对象中
const mergedObj = Object.assign(obj1, obj2, obj3);

console.log(mergedObj);

// 输出：{ a: 1, b: 2, c: 3 }

assign() 语法​

assign() 方法的语法为：

Object.assign(target, ...sources);

这里，assign() 是一个静态方法。因此，我们需要使用类名 Object 来访问该方法。

assign() 参数​

assign() 方法接受以下参数：

  • target - 目标对象，我们将向其复制源对象的所有属性。
  • sources - 源对象，我们想要复制其属性。

assign() 返回值​

assign() 方法返回目标对象。

注意： 如果目标对象和源对象具有相同的键，则目标对象中的属性将被源对象中的属性覆盖。

示例 1：使用 Javascript Object.assign() 克隆对象​

// 创建源对象
const obj = {
  name: "Alan Turing",
  age: 20,
};

// 创建目标对象
let newObject = {};

// 将 obj 的可枚举属性复制到 newObject
// newObject 被返回并存储在 copy 对象中
const copy = Object.assign(newObject, obj);

// 打印 copy 对象
console.log(copy);

// 输出：{ name: 'Alan Turing', age: 20 }

// 打印 newObject
console.log(newObject);

// 输出：{ name: 'Alan Turing', age: 20 }

在上述示例中，我们使用了 assign() 方法将 obj 的内容分配给 newObject。

由于 assign() 修改了目标对象并返回相同的对象，因此 copy 和 newObject 是彼此的克隆。因此，当我们打印它们时，我们得到了相同的输出。

示例 2：使用 assign() 合并对象​

// 源对象
const o1 = { a: 1, b: 2, c: 3 };
const o2 = { b: 12, c: 13 };
const o3 = { c: 23 };

// 合并 o1、o2 和 o3
// 早期源对象的键被后期源对象覆盖
const o4 = Object.assign({}, o1, o2, o3);

console.log(o4);

// 输出：{ a: 1, b: 12, c: 23 }

在上述示例中，我们使用 assign() 将 o1、o2 和 o3 合并到新对象 o4 中。

const o4 = Object.assign({}, o1, o2, o3);

使用空对象 {} 作为目标对象确保其他对象的属性被复制到一个新对象中，而不修改任何源对象。

从输出中可以看出，后续对象的属性会覆盖先前对象的属性。例如，

  • 来自 o1 的 b 键被 o2 中的对应键覆盖。
  • 来自 o1 和 o2 的 c 键被 o3 中的对应键覆盖。

注意： 如果源值是对对象的引用，则只复制引用值。

推荐阅读：

最后于 更新