JS深度克隆实现

作者: Odeng | 来源:发表于2019-08-07 11:23 被阅读0次

js克隆
JS实现深度克隆
JS深度克隆实现
js实现深度克隆
js 浅拷贝和深拷贝
js代码题
深度克隆
js实现通用深度克隆
JS如何实现深度拷贝（克隆）
js深度克隆

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Clone</title>
</head>
<body>
    <script>
        function clone (data) {
            let type = typeof data;
            let copy = null;
            switch (type) {
                case 'undefined':
                    copy = data;
                    break;
                case 'number':
                    copy = data;
                    break;
                case 'string':
                    copy = data;
                    break;
                case 'boolean':
                    copy = data;
                    break;
                
                case 'object'://数组对象
                    let typeStr = Object.prototype.toString.call(data);
                    if (typeStr === '[object Array]') {
                        copy = [];
                        for (i = 0; i < data.length; i++) {
                            copy.push(clone(data[i]));
                        }
                    } else if (typeStr === '[object Object]') {
                        copy = {};
                        for (let key in data) {
                                copy[key] = clone(data[key]);
                        }
                    }
                    break;
                case 'function':
                    copy = data;
                    break;
                default:
                    copy = data;
            }
            return copy;
        }

        let obj = {
            a: 'a',
            b: 'b'
        };
        //对象复制测试
        let copyObj = clone(obj);
        console.log('clone obj ',clone(obj));
        console.log('obj == copyObj ', obj == copyObj);
        console.log('obj == copyObj ', obj === copyObj);
        let obj1 = {
            a: {
                a: 1,
                b: 2
            },
            b: {
                a: 3,
                c: 4
            }
        };
        let copy1 = clone(obj1);
        console.log('obj1.a == copy1.a', obj1.a == copy1.a);
        console.log('obj1.a === copy1.a', obj1.a === copy1.a);
        console.log('obj1.b == copy1.b', obj1.b == copy1.b);
        console.log('obj1.b === copy1.b', obj1.b === copy1.b);
        //数组复制测试
        let arr1 = [1, 2, 3, 4];
        //对象数组复制测试
        let arr2 = [
            1,
            {
                a: 2,
                b: 3
            },
            [4, 5]
        ];
        let cloneArr1 = clone(arr1);
        console.log('arr1 == cloneArr1', arr1 == cloneArr1);
        console.log('arr1 == cloneArr1', arr1 === cloneArr1);

        let cloneArr2 = clone(arr2);
        console.log('arr2 == cloneArr2', arr2[0] == cloneArr2[0]);
        console.log('arr2 === cloneArr2', arr2[1] === cloneArr2[1]);
        console.log('arr2 === cloneArr2', arr2[2] === cloneArr2[2]);
    </script>
    
</body>
</html>