JS 浅层复制 与 深层复制 DAY60

浅层复制 ( shallow copy )

for in 写法

// 浅层复制
var family = {
    home: '小黑家',
    members:{
        mom: '老妈',
        father: '老爸',
        black: '小黑',
    }
}
var newFamily = {};
for(var key in family){
    console.log(key); // home members (family第一层属性)
    newFamily[key] = family[key];
}
console.log(newFamily,family);

// 修改第一层属性 
newFamily.home = '大雄家';
console.log(newFamily,family); // 大雄家 小黑家
console.log(newFamily === family); // false

// 修改第二层属性
newFamily.members.black = '大黑';
console.log(newFamily,family); // 大黑 大黑
console.log(newFamily === family); // false
// 且会发现 两个同时都会改 所以只能做到第一层的复制

jQuery 写法

var newFamily2 = jQuery.extend({},family);

ES6 写法

var newFamily3 = Object.assign({},family);

深层复制(deep copy)
透过 JSON.stringify 先转字串 再透过 JSON.parse 转成物件

var family = {
    home: '小黑家',
    members:{
        mom: '老妈',
        father: '老爸',
        black: '小黑',
    }
}
var newFamily4 = JSON.parse(JSON.stringify(family));
newFamily4.home = '小白家';
newFamily4.members.black = '大黑';
console.log(family,newFamily4); // 小黑家 小黑 ， 小白家 大黑
console.log(family === newFamily4); // false

那今天的介绍就到这里
若有任何问题 或 内容有误
都可以跟我说唷