Object.assign 的奇怪行为

Question

我最近在 JavaScript 中尝试了 Spread Syntax 的运气，结果很奇怪和疯狂，足以 post 这个问题。我对 Spread Syntax 的假设是它类似于 Object.assign()，但它会随着相同性质的变量而变化吗？

a = {a: "a"};
b = {b: "b"};
c = {c: "c"};
d = {d: {e: "e"}};

d = Object.assign(a, b, c, d);
e = { ...a, ...b, ...c, ...d };

console.log("Before Variable Change");
console.log(d);
console.log(e);

a.a = "s";
b.b = "t";
d.d.e = "f";

console.log("After Variable Change");
console.log(d);
console.log(e);

.as-console-wrapper {max-height: 100% !important; height: 100% !important;}

我得到的结果是：

Before Variable Change
{
  "a": "a",
  "b": "b",
  "c": "c",
  "d": {
    "e": "e"
  }
}
{
  "a": "a",
  "b": "b",
  "c": "c",
  "d": {
    "e": "e"
  }
}
After Variable Change
{
  "a": "s",
  "b": "b",
  "c": "c",
  "d": {
    "e": "f"
  }
}
{
  "a": "a",
  "b": "b",
  "c": "c",
  "d": {
    "e": "f"
  }
}

我能理解 d.e 的值总是会改变，因为它的 "object" 性质是可变的，所以被接受。但是当我尝试使用 ... 扩展语法时， 对象的第一个值被更改 (a.a) 但第二个值没有更改 (b.b)。我在这里遗漏了什么吗？

额外信息：

使用浏览器检查：

Chrome macOS，版本 71.0.3578.98（官方构建）（64 位）
Chrome Windows，版本 70.0.3538.110（官方构建）（32 位）

Answer 1

Object.assign()函数改变第一个对象参数的内容，即a。这也是 return 值，因此在设置 d 值的第一个 Object.assign() 调用之后，d === a.

为真

因此 "s" 到 a.a 的赋值也会改变 d.a 因为 d 和 a 引用同一个对象。

只需简单地加上我的两分钱：

换句话说，展开运算符是这样做的：

d = Object.assign({}, a, b, c, d);
e = { ...a, ...b, ...c, ...d };

现在以上都一样了

Object.assign 的奇怪行为

Weird behaviour of Object.assign

javascript

object

assignment-operator

spread-syntax