javascript - Object.assign() 和 '= assign' 实现数组或对象的浅拷贝有什么区别？

Question

在下面的代码中实现对象的浅拷贝，但是不同的输出让我很困惑:

对象.分配:

var obj = {
  name: 'wsscat',
  age: 0,
  add: {
    a: 'beijing'
  }
}
var obj2 = Object.assign({}, obj);
obj2.age = 18;
obj2.add.a = 'shanghai';
console.log(obj)
console.log(obj2)

输出:

{ name: 'wsscat', age: 0, add: { a: 'shanghai' } }
{ name: 'wsscat', age: 18, add: { a: 'shanghai' } }

同时使用= "assign"实现浅拷贝:

var obj = {
  name: 'wsscat',
  age: 0,
  add: {
    a: 'beijing'
  }
}
// var obj2 = Object.assign({}, obj);
var obj2 = obj;
obj2.age = 18;
obj2.add.a = 'shanghai';
console.log(obj)
console.log(obj2)

输出:

{ name: 'wsscat', age: 18, add: { a: 'shanghai' } }
{ name: 'wsscat', age: 18, add: { a: 'shanghai' } } 

Answer 1

我认为你的意思是“浅拷贝”，而不是“卷影拷贝”，所以我会在我的回答中提到前者。

通过使用赋值运算符=，您只需复制引用，因此obj2 指向与obj 相同的对象，因此更改属性会反射(reflect)在两者。

您使用 Object.assign 的方式，通过将所有自己的属性从源对象 obj 复制到目标对象(空)，然后将其分配给变量 obj2。

原始数据类型(null、undefined、String、Number、Boolean)按值复制，因此两个对象上的键 name 和 age 在内存中包含不同的值) .对象类型(Object、Arrray、Function)通过引用复制，因此 add 属性下的对象在 obj 和 obj2 之间共享。 obj2.add.a 中的任何更改都将反射(reflect)在 obj.add.a 上。

看看 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assigne/ 的 polyfill 实现

编辑:polyfill 实现的另一个链接:https://gist.github.com/spiralx/68cf40d7010d829340cb

EDIT2:阐明了复制原始类型和对象之间的区别。