仔细看看,会有收获。js深浅拷贝

小小码农,可笑可笑
• 阅读 1364

好好理解深浅拷贝和赋值(针对引用类型)

赋值:两个对象指向同一内存地址。结果,无论是修改基本类型还是引用类型,两个对象的值都会改变。

浅拷贝:两个对象指向不同的内存地址,但是他们中的引用类型数据指向同一内存地址。结果,修改引用类型,两个对象的值都会改变;修改基本类型,互不影响。

深拷贝:两个对象指向不同的内存地址,他们中的引用类型也指向不同的内存地址。结果,均互不影响。

直接通过Object.assign()实现浅拷贝

浅拷贝:

const target = { 
    a: 1, 
    b: 2 ,
    c:[1,2],
    d:function() {
      console.log(this.d)
    }
};
let newObj = Object.assign({},target);
newObj.a = 3
newObj.c[1] = 3
console.log('newObj',newObj)
console.log('target',target)

手写深浅拷贝:

浅拷贝:

let target = { a: 1, b: 2 ,c:[1,2],d:function() {
  console.log(this.d)
}};
//let cc = Object.assign({},target);
let cc = shallowClone(target);
cc.c[1] = 4
console.log('cc',cc)
console.log('target',target)
function shallowClone(obj) {
  let newObj = new Object()
  for (const key in obj) {
    if (Object.hasOwnProperty.call(obj, key)) {
      newObj[key] = obj[key];
    }
  }
  return newObj
}

深拷贝:

let target = { a: 1, b: 2 ,c:[1,2],d:function() {
  console.log(this.d)
}};
let cc = deepClone(target);
cc.c[1] = 4
console.log('cc',cc)
console.log('target',target)
function deepClone(obj) {
  let type = Object.prototype.toString.call(obj)
  console.log(type)
  if(type.indexOf('Object') === -1){
    return obj
  }else{
    let newObj = new Object()
    for (const key in obj) {
      if (Object.hasOwnProperty.call(obj, key)) {
        newObj[key] = deepClone(obj[key]);
      }
    }
    return newObj
  }
}
点赞
收藏
评论区
推荐文章
Wesley13 Wesley13
3年前
java 复制Map对象(深拷贝与浅拷贝)
java复制Map对象(深拷贝与浅拷贝)CreationTime2018年6月4日10点00分Author:Marydon1.深拷贝与浅拷贝  浅拷贝:只复制对象的引用,两个引用仍然指向同一个对象
2022年最新iOS面试题(附答案)
最近大家都要准备去面试或者已经在面试的,这里我给大家准备了挺多资料,可以私信我拿,看看了解下。底下就是我整理出来的一些面试题iOS类(class)和结构体(struct)有什么区别?Swift中,类是引用类型,结构体是值类型。值类型在传递和赋值时将进行复制,而引用类型则只会使用引用对象的一个"指向"。所以他们两者之间的区别就是两个类型的区别。举个简单的
晴空闲云 晴空闲云
3年前
也谈JavaScript浅拷贝和深拷贝
网上关于这个话题,讨论有很多了,根据各路情况我自己整理了一下,最后还是能接近完美的实现深拷贝,欢迎大家讨论。javascript中的对象是引用类型,在复制对象的时候就要考虑是用浅拷贝还是用深拷贝。直接赋值对象是引用类型,如果直接赋值给另外一个对象,那么只是赋值一个引用,实际上两个变量指向的同一个数据对象,如果其中一个对象的属性变更,那么另外一个也会变更。示
Souleigh ✨ Souleigh ✨
4年前
实现深拷贝的多种方式
实现深拷贝的多种方式简单来说,深拷贝主要是将另一个对象的属性值拷贝过来之后,另一个对象的属性值并不受到影响,因为此时它自己在堆中开辟了自己的内存区域,不受外界干扰。浅拷贝主要拷贝的是对象的引用值,当改变对象的值,另一个对象的值也会发生变化。1.简单深拷贝(一层浅拷贝)①for循环拷贝//只复制第一层的浅拷贝javascriptfunc
Stella981 Stella981
3年前
React之浅拷贝与深拷贝
 最近发现的一个bug让我从react框架角度重新复习了一遍浅拷贝与深拷贝。浅拷贝,就是两个变量都是指向一个地址,改变了一个变量,那另一个变量也随之改变。这就是浅拷贝带来的副作用,两个变量会相互影响到,因为它们指向同一个地址。深拷贝,就是互相独立,指向的是不同的地址,一个变量改变了,另一个变量不会被影响到。react角度:父组件传给
Wesley13 Wesley13
3年前
Java深拷贝和浅拷贝
1.浅复制与深复制概念⑴浅拷贝(浅克隆)   复制出来的对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原来的对象。⑵深拷贝(深克隆)   复制出来的所有变量都含有与原来的对象相同的值,那些引用其他对象的变量将指向复制出来的新对象,而不再是原有的那些被引用的对象。换言之,深复制
Wesley13 Wesley13
3年前
Java对象的浅拷贝和深拷贝&&String类型的赋值
Java中的数据类型分为基本数据类型和引用数据类型。对于这两种数据类型,在进行赋值操作、方法传参或返回值时,会有值传递和引用(地址)传递的差别。浅拷贝(ShallowCopy):①对于数据类型是基本数据类型的成员变量,浅拷贝会直接进行值传递,也就是将该属性值复制一份给新的对象。因为是两份不同的数据,所以对其中一个对象的该成员变量值进行修改,
Stella981 Stella981
3年前
JavaScript的深拷贝和浅拷贝
一、数据类型数据分为基本数据类型(String,Number,Boolean,Null,Undefined,Symbol)和对象数据类型。、1.基本数据类型的特点:直接存储在栈(stack)中的数据2.引用数据类型的特点:存储的是该对象在栈中引用,真实的数据放在堆内存里。引用数据类型在栈中存储了指针,该指针指向堆中该实
Wesley13 Wesley13
3年前
Java 多态
类型的检测——向上转型向下转型向上转型:父类对象的引用指向子类对象,向下转型:向上转型的基础上再次指向子类的对象1.向上转型!(https://oscimg.oschina.net/oscnet/dd0d05d39a724e781b799ff5e35b921775d.jpg)!(https://oscimg.oschina.net/o
Stella981 Stella981
3年前
JavaScript基础心法——深拷贝和浅拷贝
!(https://oscimg.oschina.net/oscnet/c131215a5aaaeb7909d7398688df6ea6dcd.png)浅拷贝和深拷贝都是对于JS中的引用类型而言的,浅拷贝就只是复制对象的引用,如果拷贝后的对象发生变化,原对象也会发生变化。只有深拷贝才是真正地对对象的拷贝。前言说到深浅拷贝,必须先
小小码农,可笑可笑
小小码农,可笑可笑
Lv1
热爱前端,热爱生活
文章
5
粉丝
2
获赞
7