深拷贝 && 浅拷贝

区别

深拷贝:A 复制了 B,A 改变,B 不变
浅拷贝:A 复制了 B,A 变B 也变;

浅拷贝只拷贝了数据的第一层,对引用型的数据只拷贝了引用。深拷贝是拷贝多层数据,每一层数据都拷贝了。

实现浅拷贝的方法

  1. 直接赋值

  2. Object.assign()

	var obj1 = {
	    a: "hello",
	    b: {
	        a: "hello",
	        b: 21}
	};
	 
	var cloneObj1= Object.assign({}, obj1);
	cloneObj1.a = "changed";
	cloneObj1.b.a = "changed";
	console.log(obj1.a);  //hello

实现深拷贝的方法

  1. JSON.pares(JSON.stringify(object))
    通过 JSON.pares(JSON.stringify(object)) 来解决这个问题

    let obj1 = {
        age : 18,
        bank : {
            b1 : '中国招商银行',
        }
    }

    let obj2 = JSON.parse(JSON.stringify(obj1))
    obj1.bank.b1 = '中国建设银行'
    console.log(obj2.bank.b1)       // 中国招商银行
    
	缺点:
	1)会忽略 undefined
	2)不能序列化函数
	3)抛弃原对象的 constructor,变为 object

    let obj = {
        name: unfefined,
        say: function () {},
        school: 'HNUST'
    }
    let res = JSON.parse(JSON.stringify(obj))   // {school: 'HNUST'}
    // 该方法会忽略掉函数和 undefined ,所以序列化后就只有school
  1. Object,create()
	function deepClone(initalObj, finalObj) {    
	  var obj = finalObj || {};    
	  for (var i in initalObj) {        
	    var prop = initalObj[i];        // 避免相互引用对象导致死循环,如initalObj.a = initalObj的情况
	    if(prop === obj) {            
	      continue;
	    }        
	    if (typeof prop === 'object') {
	      obj[i] = (prop.constructor === Array) ? [] : Object.create(prop);
	    } else {
	      obj[i] = prop;
	    }
	  }    
	  return obj;

猜你喜欢

转载自blog.csdn.net/weixin_42186513/article/details/83418144