Object.assign 的奇怪行为

Posted 2023-02-22

【中文标题】Object.assign 的奇怪行为

【英文标题】：Weird behaviour of Object.assign

【发布时间】：2019-06-11 17:31:21

【问题描述】：

我最近在 javascript 中尝试了使用传播语法的一些运气，结果非常奇怪和疯狂，以至于发布了这个问题。我对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 的值总是会因为它的“对象”性质而改变，并且它们是可变的，因此被接受。但是当我尝试使用 ... 扩展语法时，对象的第一个值发生了变化（a.a），但第二个值没有变化（b.b）。我在这里遗漏了什么吗？

---

额外信息：

用浏览器检查：

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

【问题讨论】：

散布...令牌不是算子；它不是表达式语法的一部分。

@Pointy 好的，我没完全理解。你能解释一下吗？

好吧，“运算符”是一个用来描述+、/ 等事物的术语。... 语法当然是语言的一部分，但它不是运算符之一表达式语法。

@Pointy 啊哈！改变它。

你很困惑，因为d === a 在d = Object.assign(a, …) 行之后

【参考方案1】：

Object.assign()函数改变了第一个对象参数的内容，即a。这也是返回值，所以在第一个设置d 值的Object.assign() 调用之后，d === a 将是真的。

因此，将“s”分配给a.a 也会改变d.a，因为d 和a 引用了同一个对象。

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

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

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

现在上面两个都是一样的。

【讨论】：

它确实发生了变化，但您的代码没有记录 b 的值。

您在代码中的哪个位置对a.b 或d.b 进行了更改？您只需更改b.b，对象b 的“b”属性与对象d（和a）的“b”属性无关。

很抱歉造成混乱；我误解了你的误解:)

哈哈哈......我现在明白了......这真的是一件令人困惑的事情还是只是我？所以现在我明白Object.assign 和... 是不一样的。

Object.assign( [,other args/objs here]) 就像传播一样，它们就是这样变化的。