关于JS的深浅拷贝

JS关于基础类型和引用类型的数据请点击:JS数据类型
请充分理解之后再来看这篇文章哦~

基本类型的拷贝

先来看一段非常经典的代码

var a = 1;
var b = a;
a = 200;
console.log(a);      //200
console.log(b);      //1

我们应该知道基本类型“按值传递”,引用类型“按引用传递”,数值作为基本类型是保存在栈内存中,可以直接拿来用的,赋值是什么那么之后就一直是什么,不会受到传递元素的改变带来的影响,所以这里就不难理解上面的代码得到的值的原因了。

引用类型的拷贝

简单说,引用类型是生成一个指针保存的堆内存中,当给引用类型赋值时,我们写的内容是在栈内存中,也就是说我们拿到的其实是一个指针(不会直接拿到栈内存中的内容)。这个指针是指向栈内存中这个引用类型的代码。
提到拷贝涉及到的两种拷贝类型:深拷贝和浅拷贝

浅拷贝

浅拷贝针对对象中的基本类型的值生效,但是对引用类型中还有引用类型的情况就会失效。

var a = {
  name:"mary",
  age:20,
  hobby:"eat"
}

function shadowCopy(obj){
  var newObj = {};
  for(var key in obj){
     newObj[key] = obj[key];
  }
  return newObj;
}
var b = shadowCopy(a);
console.log(b)

这是得到的就是一个和a完全一样的对象,这个函数就是一个浅拷贝函数。

深拷贝

深拷贝是针对对象中还有引用类型的情况,使用深拷贝可以使新创建的对象和原来的完全脱离关系

var a = {
  name:"mary",
  age:20,
  friend:{
    name:"哈哈",
    age:19,
    hobby:"eat"
  }
}

function deep(obj){
  var newobj = {};
  for(var key in obj){
    if(obj.hasOwnProperty(key)){
      if(typeof obj[key] === "number" || typeof obj[key] === "string" || typeof obj[key] === "boolean" || obj[key] === undefined || obj[key] === null){
         newobj[key] = obj[key];
      }else{
        newobj[key] = deep(obj[key]);
      }
    }
  }
  return newobj;
}
var b = deep(a);
a.friend.age = 29;        //此处修改了a对象中的某个值,但是经过函数处理,b里面的这个值不会发生改变
console.log(a);
console.log(b);

里面的hasOwnProperty这个属性请参考 MDN的解释

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1.写一个NSString类的实现 +(id)initWithCString:(c*****t char *)nu...
    韩七夏阅读 3,827评论 2 37
  • Java8张图 11、字符串不变性 12、equals()方法、hashCode()方法的区别 13、...
    Miley_MOJIE阅读 3,788评论 0 11
  • *面试心声:其实这些题本人都没怎么背,但是在上海 两周半 面了大约10家 收到差不多3个offer,总结起来就是把...
    Dove_iOS阅读 27,273评论 30 472
  • __block和__weak修饰符的区别其实是挺明显的:1.__block不管是ARC还是MRC模式下都可以使用,...
    LZM轮回阅读 3,427评论 0 6
  • 307、setValue:forKey和setObject:forKey的区别是什么? 答:1, setObjec...
    AlanGe阅读 1,611评论 0 1