js的几种数据类型及深拷贝,浅拷贝

1.数据类型

- 1.原始数据类型
数值,字符串,布尔,null,undefined
直接存储在栈(stack)中的数据
- 2.引用数据类型
对象
存储的是该对象在栈中引用,真实的数据存放在堆内存里

2.对象拷贝

浅拷贝只拷贝第一层,深拷贝递归遍历拷贝每一层
image

1.浅拷贝

浅拷贝是按位拷贝对象,它会创建一个新对象,这个对象有着原始对象属性值的一份精确拷贝。
如果属性是基本类型,拷贝的就是基本类型的值;
如果属性是内存地址(引用类型),拷贝的就是内存地址 (共享一片内存)

 let obj={
            name:"miaomiao",
            age:11,
            girlFriend:{
                name:'小红'
            }
        }
        //浅拷贝,基本数据类型会实现精准拷贝,子对象拷贝只是拷贝其内存地址
        function copy(obj){
            let newObj={}
            for(let i in obj){
                newObj[i]=obj[i]
            }
            return newObj
        }
        let newobject=copy(obj)
       
 console.log(obj.girlFriend.name);
        //修改newobject的女朋友为小明
        newobject.girlFriend.name='小明'
     1   console.log(newobject.girlFriend.name);
     2   console.log(obj.girlFriend.name);
		
		
		//1.2输出的都为小明
2.深拷贝

1.利用递归实现深拷贝

//深拷贝
        function copy(obj){
            let newObj={}
            for(let i in obj){
                //判断该属性值是否为对象
                if(obj[i] instanceof Object){
				//如果为对象,在拷贝一层
                    newObj[i]=copy(obj[i])
                }else{
                    newObj[i] = obj[i]
                }
                
            }
            return newObj
        }
        let newobject=copy(obj)    
    
        //修改newobject的女朋友为小明
        newobject.girlFriend.name='小明'
        console.log(newobject.girlFriend.name);
        console.log(obj.girlFriend.name);

        //输出:小明,小红

2.利用JSON拷贝
image

 let obj = {
                name: "miaomiao",
                age: 11,
                girlFriend: {
                    name: '小红'
                }
            }
            function copy(obj){
		//将对象转换为json字符串
                let str = JSON.stringify(obj)
		//将json字符串转换为js对象
                let newObj=JSON.parse(str)
                return newObj
            }
      let newobject= copy(obj)
posted @   Kira的学习笔记  阅读(127)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)
点击右上角即可分享
微信分享提示