关于前端:javascript关于Array数组Object对象的浅拷贝和深拷贝

了解Array和Object的浅拷贝，深拷贝

先总结用法：

浅拷贝：只有一层构造的，简略的Array和Object的属性、值援用的拷贝；深拷贝：多层接口嵌套的，简单的Array和Object的地址援用的拷贝；浅拷贝Array：    [].concat(arr)    浅拷贝Object：    Object.assign({}, obj)    深拷贝Array、Object、两者多层混合：    JSON.parse(JSON.stringify(arrWithObj)) // 先解析为字符串，再解析为json对象

浅拷贝Array

var copyArr = [].concat(arr);

var arr = [1, 2, 3];var copyArr = [].concat(arr);copyArr.push(4);console.log(arr); // 1, 2, 3console.log(copyArr); // 1, 2, 3, 4

浅拷贝Object
var copyObj = Object.assign({}, obj);

var obj = {name: 'Tom', age: 12};var copyObj = Object.assign({}, obj);copyObj.address = 'beijing';console.log(obj); // {name: "Tom", age: 12}console.log(copyObj); // {name: "Tom", age: 12, address: "beijing"}

深拷贝Array
JSON.parse(JSON.stringify(arr));

var arr = [[1, 2], [3, 4]];var copyArr = JSON.parse(JSON.stringify(arr));copyArr[1].push([5, 6]);console.log(arr); // [[1, 2], [3, 4]]console.log(copyArr); // [[1, 2], [3, 4, [5, 6]]]

深拷贝Object
JSON.parse(JSON.stringify(obj));

var obj = {name: 'Tom', result: {chinese: 97, math: 95}};var copyObj = JSON.parse(JSON.stringify(obj));copyObj.result.english = 93;console.log(obj); // {name: 'Tom', result: {chinese: 97, math: 95}}console.log(copyObj); // {name: 'Tom', result: {chinese: 97, math: 95, english: 93}}

深拷贝两者多层混合
JSON.parse(JSON.stringify(arrWithObj));

var arr = [{key: 'Lucy', value: '10'}, {key: 'Lily', value: '20'}];var copyArr = JSON.parse(JSON.stringify(arr));copyArr.forEach((item) => {item.is_checked = false});console.log(arr); // [{key: 'Lucy', value: '10'}, {key: 'Lily', value: '20'}]console.log(copyArr); // [{key: 'Lucy', value: '10', is_checked: false}, {key: 'Lily', value: '20', is_checked: false}]