JavaScript中如何给对象属性可变引用赋值使两变量指向同一对象

解决方案 #

直接将panel对应层级的属性替换为data的引用即可，全程不需要做任何属性拷贝操作，修改后的代码如下：

let data = {
  "world": "bc",
  "d": "ef",
  "g": "hi",
};
let panel = {
  "hello": {
    "world": {},
  }
};
let dataTree;
let exampleBool = true;

if (exampleBool) {
  panel.hello.world = data;
  dataTree = panel.hello.world;
} else {
  panel.hello = data;
  dataTree = panel.hello;
}

dataTree.world = "xz";

console.log(dataTree.world);
console.log(data.world);
console.log(data === dataTree);

运行后输出完全符合预期：

xz
xz
true

原理解释 #

你之前的实现是把data的属性逐个拷贝到dataTree指向的已有对象中，两个对象是独立的内存地址，自然无法满足引用相等的要求。
修改后的方案直接把panel对应层级的属性值替换为data的引用，没有遍历属性的操作，哪怕data有上万个键也不会产生额外性能开销。

内容的提问来源于stack exchange，提问作者Raphiki