js深浅拷贝

一、数据类型和存储

数据类型在js中分为基本数据类型和引用数据类型,其中基本数据类型有:String, Number, Boolean, Null, Undefined等,而引用数据类型有:数组、函数、字典等。

他们的存储方式是不同的。

  • 对于基本数据类型的数据直接存储在栈中。
  • 对于引用类型的数据,在栈中存储的只是一个地址,真实的数据存储在地址对应的堆中。

由此引出了一个问题,当我们把‘变量1’赋值给‘变量2’,然后再改变‘变量1’中的内容,那‘变量2’会跟着改变吗?

二、数据类型和改变

1、对于基本类型的数据,当我们做出以下操作:

		var str1 = '北京';
        // 将 str1 中存储的数据北京 赋值给 str2 
        var str2 = str1;
        // 之后对str1 进行修改操作,
        str1 = '上海';
        console.log(str1 , str2);
        

结果是
在这里插入图片描述
我们发现当我们改变‘str1’时,虽然‘str2’的值是‘str1’给予的,但‘str2’的值并不会跟着改变,也就是‘str2’在赋值之后就与‘str1’没有任何关系了,成为了一个单独的变量。

2、对于引用类型的数据,当我们做出以下操作:

		var arr1 = [1, 2, 3, 4, 5];
        // 将arr1 存储的内存地址,赋值给arr2,两个变量存储的是相同的内存地址
        var arr2 = arr1;
        // arr1操作,数组,arr2也会改变
        // 因为arr1和arr2,同时存储的是相同的数据,操作的也是同一个数组
        // 同理,arr2,操作数组,arr1也会改变
        arr1[0] = '北京';
        console.log(arr1);
        console.log(arr2);

结果是
在这里插入图片描述
我们会发现当我们改变arr1时,arr2也会跟着改变,这主要是因为,arr1是引用类型的数据,arr1赋值给arr2的并不是数据本身,而是指向数据的内存地址,所以但我们改变了arr1中的值,arr2再根据地址找的数据是已经修改后的数据,以至于改变arr1的值,arr2的值也会跟着改变。这就是浅拷贝。

三、如何实现深拷贝

深拷贝就是将引用类型数据,变得和基本类型数据的拷贝赋值一样。

 		// 不想两个变量操作数组,都会改变,想建立一个独立的变量,只是存储相同的数据
        // 需要建立一个独立的变量,复制引用数据类型中的数据内容
        // 只复制 引用数据类型中的 数值 而不是 复制地址
        // 称为 深拷贝

        // 只复制arr3中的数据
        var arr3 = ['北京','上海','广州','重庆','天津'];

        // 循环遍历,获取arr3中的所有数据数值,赋值到新的数组中
        var arr4 = [];

        // 通过循环,生成arr3的所有索引下标
        for(var i = 0 ; i <= arr3.length-1 ; i++){
            // arr3[i] 就是获取 arr3中的 存储的 数据信息
            // arr4.push() 将arr3中的数据 arr3[i] , 写入到 arr4中
            arr4.push(arr3[i]);
        }
        console.log(arr4);
        arr3[0] = '武汉';
        console.log(arr3 , arr4);

结果是
在这里插入图片描述
只有arr3中的‘北京’变成了‘武汉’,而arr4中的依旧是‘北京’没有改变,这就实现了深拷贝。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值