关于javascript:JS对象拷贝的几种方式以及赋值引号问题

明天做我的项目的时候，在对对象赋值时，发现字段名不对，变成了object。
于是做了以下测试：
上面是对象拷贝的几种形式：...扩大运算符，Object.assign(),JSON转化。

const data = {a:1,b:2,c:undefined}const app = {data:{a:2,b:4},state:{x:true}}app[data] = dataconst backup1 = {...app}const backup2 = Object.assign({},app)const backup3 = JSON.parse(JSON.stringify(app))console.log(app)console.log(backup1)console.log(backup2)console.log(backup3)

输入后果如下：

\> Object { data: Object { a: 2, b: 4 }, state: Object { x: true }, [object Object]: Object { a: 1, b: 2, c: undefined } } \> Object { data: Object { a: 2, b: 4 }, state: Object { x: true }, [object Object]: Object { a: 1, b: 2, c: undefined } } \> Object { data: Object { a: 2, b: 4 }, state: Object { x: true }, [object Object]: Object { a: 1, b: 2, c: undefined } } \> Object { data: Object { a: 2, b: 4 }, state: Object { x: true }, [object Object]: Object { a: 1, b: 2 } }

发现了吗，data字段没有变，而是结尾多了一个object Object字段。
起因在于赋值时用了app[data] = data，而其中的data在上文定义成一个常量了，所以时object。
若想失常赋值，得加上引号，即app['data']=data

也能够通过app.data = data进行赋值。

最初，咱们把赋值代码批改正确后，咱们在再两头加上一句backup1'data' = 9 ，及批改对象的值，来看看谁是浅拷贝，谁是深拷贝。

后果如下：

> Object { data: Object { a: 9, b: 2, c: undefined }, state: Object { x: true } }
> Object { data: Object { a: 9, b: 2, c: undefined }, state: Object { x: true } }
> Object { data: Object { a: 9, b: 2, c: undefined }, state: Object { x: true } }
> Object { data: Object { a: 1, b: 2 }, state: Object { x: true } }

总结：
浅拷贝：扩大运算符、Object.assign
深拷贝：JSON，以及for循环遍历对值拷贝

JSON会疏忽掉undefined字段

赋值问题：data['a']或data.a进行赋值。

下次有机会再写一篇js对于数组的操作。