码迷,mamicode.com
首页 > Web开发 > 详细

JS的深度克隆,利用构造函数原型深度克隆

时间:2019-03-29 17:47:46      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:div   obj   面试   深度   span   ret   color   自定义   构造   

我爱撸码,撸码使我感到快乐!
大家好,我是Counter。
今天来写写,JS中的深度克隆,这个在笔面试中,考的还是比较多的,主要是对象与数组的赋值,如果直接赋值的话,那么得到的是对象或者数组在堆里的地址,那么原有的的数据修改的话,那么克隆的数据也会随着修改,这就是浅克隆,所以这边就要使用到枚举,然后再每一项赋值,这样就可以完成一份深度克隆,这样原对象里修改属性,如果你在这对象修改之前已经克隆的话,那么你这个克隆的对象,对象里的属性是不变,这就是深度克隆。
话不多说了,直接上代码:

// 假设要克隆的对象a
        var a = {
            a: 1,
            b: 2,
            c: {
                d: 3,
                e: 4,
                f: [0, 9, 8, 7, [6, 5, 4]]
            }
        };

        // 自定义克隆函数
        function clone(obj) {
            // 判断,如果传进来的参数是数组的话
            if ( obj instanceof Array) {
                // 定义一个空数组
                var arr = [];
                // 遍历整个数组
                for( var i = 0; i < obj.length; i++) {
                    // 深度克隆数组每一项
                    arr[i] = clone(obj[i]);
                }
                // 再返回出去
                return arr;
            }
            // 判断是否为对象
            if ( obj instanceof Object) {
                // 构建一个空对象
                var obj1 = {};
                // 枚举传进来的对象
                for( key in obj) {
                    // 深度克隆对象
                    obj1[key] = clone(obj[key]);
                }
                // 再返回出去
                return obj1;
            }
            // 如果传进的不是数组,也不是对象,那么就返回当前值
            return obj;
        }



        // 利用构造函数的原型克隆,也可以实现深度克隆
        function clone1(obj) {
            function F() {};
            F.prototype = obj;
            return new F()
        }

 

JS的深度克隆,利用构造函数原型深度克隆

标签:div   obj   面试   深度   span   ret   color   自定义   构造   

原文地址:https://www.cnblogs.com/Counterrr/p/10622439.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!