我查看了js文档,并且在研究它在object.assign()中提到的文档时 如果源值是对对象的引用,则它只复制该引用值.

在我的下面的代码片段中,一个改变了原始对象,而另一个不改变

    var objA = {
    a: 1,
    b: {
       c: 2,
       d: {
       e: 3,
     },
    },
  } 
var objC = { t: 1 };

  //why this works i.e adds a to objEmpty
// var objEmpty = Object.assign({}, { objC });  //this would add a prop to the objEmpty object

//this doesnt work i.e doesnt add a to objEmpty
var objEmpty = Object.assign({}, objC);  //this will not
objC.a = 3;

console.log(objC);

console.log(objEmpty);

我正在通过try 不同的场景来弄清楚事情到底是如何运作的,我相信这是与引用有关的事情,但如何运作呢?

文档中的另一个例子

  const obj2 = Object.assign({}, obj1);
  console.log(JSON.stringify(obj2)); // { "a": 0, "b": { "c": 0}}

  obj1.a = 1;
  console.log(JSON.stringify(obj1)); // { "a": 1, "b": { "c": 0}}
  console.log(JSON.stringify(obj2)); // { "a": 0, "b": { "c": 0}}

  obj2.a = 2;
  console.log(JSON.stringify(obj1)); // { "a": 1, "b": { "c": 0}}
  console.log(JSON.stringify(obj2)); // { "a": 2, "b": { "c": 0}}
  obj2.b.c = 3;
  console.log(JSON.stringify(obj1)); // { "a": 1, "b": { "c": 3}}
  console.log(JSON.stringify(obj2)); // { "a": 2, "b": { "c": 3}}```

why does js behave this way? why the 3 got changed but the other didn't?

Thanks in advance :)

推荐答案

为什么js会这样呢?为什么三个换了,而另一个换了 不是吗?

因为Object.assign()实际上等于Shallow Copy,所以你需要做Deep Copy

对对象进行深度复制.

有很多种方式,最常见和最流行的方式是用JSON.stringify()JSON.parse().

const oldObj = {a: {b: 1}, c: 2};
const newObj = JSON.parse(JSON.stringify(oldObj));
oldObj.a.b = 3; // will not affect the newObj
console.log('oldObj', oldObj);
console.log('newObj', newObj);

Note:有一个新的JS标准,称为structured cloning.它可以在所有浏览器上运行:

方法使用 struct 化克隆算法创建给定值的deep clone.

const clone = structuredClone(object);

Javascript相关问答推荐

Vega中的模运算符

如何在angular中从JSON值添加动态路由保护?

为什么当我解析一个promise时,输出处于挂起状态?

使用useEffect,axios和useParams进行react测试

无法访问Vue 3深度监视器中对象数组的特定对象值'

虚拟滚动实现使向下滚动可滚动到末尾

如何将react—flanet map添加到remixjs应用程序

如何使onPaste事件与可拖动的HTML元素一起工作?

我怎么才能得到Kotlin的密文?

本地库中的chartjs-4.4.2和chartjs-plugin-注解

更新动态数据中对象或数组中的所有值字符串

JavaScript是否有多个`unfined`?

在css中放置所需 colored颜色 以填充图像的透明区域

我想将Sitecore搜索面过滤器从多个转换为单个

try 将Redux工具包与MUI ToggleButtonGroup组件一起使用时出错

在高位图中显示每个y轴系列的多个值

从异步操作返回对象

为什么当雪碧的S在另一个函数中时,Phaser不能加载它?

计算对象数组中属性的滚动增量

如何在Firebase中读取对象的特定字段?