复杂数据类型深拷贝的方法

深拷贝与浅拷贝: 在复制过程中,如果B复制了A,当其中一个改变时,对方会跟着变化的是浅拷贝;对方不会跟着变化的是深拷贝。
注意: 当采用赋值拷贝时,基本数据类型(String、Number、Boolean等)的拷贝是深拷贝,复杂数据类型(Object、Array等)的拷贝是浅拷贝。
在有些时候,我们想对复杂数据类型进行深拷贝,我们可以采取以下几种方法实现复杂数据类型的深拷贝:

1、采用递归

	//  利用递归方法实现深拷贝
		// 这里要实现 obj2 与 obj1 的深拷贝
        var obj1 = { //这是一个复杂数据类型
            uname: "abc",
            age: 18,
            messige: {
                dosport: "basketball",
                music: "aaaa"
            },
            color: ["red", "blue", "green"]
        };
        var obj2 = {};

        // 封装一个函数
        function deepCopy(newObj, oldObj) { // 传入原对象和新对象
            // 用 for……in 遍历对象
            for (var k in oldObj) {
                // 先判断属性的值属于什么类型,如果是简单数据类型则直接赋值,如果是复杂数据类型,则使用递归

                // 1、获取属性值,存到一个中间变量上
                var item = oldObj[k];
                if (item instanceof Array) { // 2、判断属性值是否为数组
                    newObj[k] = []; // 如果是数组,先让新对象的这个属性为空数组,然后递归实现赋值
                    deepCopy(newObj[k], item)
                } else if (item instanceof Object) { // 2、判断属性值是否为对象
                    newObj[k] = {};// 如果是对象,先让新对象的这个属性为空对象,然后递归实现赋值
                    deepCopy(newObj[k], item)
                } else { // 简单数据类型就直接赋值即可
                    newObj[k] = item
                }
            }
        }
        deepCopy(obj2, obj1);  // 给对象深拷贝
        console.log(obj2, obj1);
        obj1.age = 80; // 改变其中一个的内容,不会影响另外一个
        console.log(obj2, obj1);

2、通过JSON来实现
首先了解一下JSON.stringify()和JSON.parse(),可以先简单理解为 JSON.stringify()是将对象转换成字符串,JSON.parse()是将字符串转换成对象。使用JSON.parse(JSON.stringify())可以实现深拷贝,但是需要注意的是这种拷贝方式不能拷贝到对象里面的方法

		// 实现数组的深拷贝
		var arr = [[1, 2], [3, 4], { name: "aaa", age: 18 }]
        var newArr = [];
        newArr = JSON.parse(JSON.stringify(arr));
        console.log(arr, newArr);
        newArr[0][0] = 10000; //改变其中一个的内容,不会影响另外一个
        arr[2].age = 80;      //改变其中一个的内容,不会影响另外一个
        console.log(arr, newArr);
        
     	// 实现对象的深拷贝
        var obj1 = {
            name: "zhangsan",
            age: 18,
            method: function () {
                console.log("I'm 18 years old");
            }
        };
        var obj2 = {};
        obj2 = JSON.parse(JSON.stringify(obj1)); 
        // 不能拷贝到原对象里面的方法,也就是 obj2 里面没有 method: function () {console.log("I'm 18 years old");}
        console.log(obj1, obj2);

3、借用 jQuery的 extend 方法
如果在使用jQuery开发项目,可以利用jQuery的extend方法实现深拷贝

		// 要先引入 jQuery 哦
		$(function () {
            var arr1 = [[1, 2], [3, 4], { name: "aaa", age: 18 }]
            var newArr1 = $.extend(true, [], arr1); // true为深拷贝,false为浅拷贝
            console.log(arr1, newArr1);
            arr1[2].age = 100; // 改变其中一个的内容,不会影响另外一个
            console.log(arr1, newArr1);
        })
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值