js深复制

Posted 2021-01-23 zgdawdl

在javascript中，数据类型可分为基本类型(String、Number、Boolean、Null、Undefined)和引用类型(Arrray、Object)

其中：

基本类型的值保存栈内存中，变量复制时会重新开辟新的内存，变量重新赋值时不会互相影响

引用类型的堆地址保存栈内存中，值保存在堆地址指向的堆内存中，变量复制时会在栈内存开辟新的空间保存堆地址的副本，指向同一个堆内存。所以某个变量值的变化会导致堆内存中的数据相应变化

浅复制：只在栈内存开辟新的空间

深复制：在栈内存和堆内存都开辟新的空间

一、利用递归进行深复制

    function cloneObj(obj) {
        var newObj;
        /* 数据、对象 */
        if (obj && typeof obj == "object") {
            newObj = Array.isArray(obj) ? [] : {};
            for (var key in obj) {
                /* 只查询自身的属性 */
                if (obj.hasOwnProperty(key)) {
                    /* 子属性仍为对象 */
                    if (typeof obj[key] == "object") {
                        newObj[key] = cloneObj(obj[key]);
                    }
                    /* 直接赋值 */
                    else {
                        newObj[key] = obj[key];
                    }
                }
            }
        }
        /* 字符串、布尔值、数字直接赋值 */
        else if (obj) {
            newObj = obj;
        }
        return newObj;
    }
    var arr3 = [1, 2, 3];
    var arr4 = cloneObj(arr3);
    arr4[0] = 4;
    var str3 = "字符串3";
    var str4 = cloneObj(str3);
    str4 = "字符串4";
    console.log(str3, str4);
    console.log(arr3, arr4);

二、利用JSON对象进行深复制

    function copyObj(obj) {
        var _obj = JSON.stringify(obj);
        var newObj = JSON.parse(_obj);
        return newObj;
    }
    var arr1 = [1, 2, 3];
    var arr2 = copyObj(arr1);
    arr2[0] = 4;
    var str1 = "字符串1";
    var str2 = copyObj(str1);
    str2 = "字符串2";
    console.log(str1, str2);
    console.log(arr1, arr2);