1. 主页
  2. 文档
  3. JS
  4. 面向对象
  5. 对象的深浅克隆

对象的深浅克隆

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        //基本类型值和引用类型值。
        var ob1 = {
            a:1,
            b:2,
            c:3
        }
        
        var ob2 = {
            a:1,
            b:2,
            c:3
        }

        console.log(ob1 == ob2);   //false
        console.log(ob1 === ob2);   //false

        //对象是引用类型值。
        var ob3 = {
            a:10
        }

        var ob4 = ob3;

        ob3.a++;
        console.log(ob4);  //{a: 11}

        //对象的浅克隆

        //对象中的c 的数组,潜克隆是同一个引用数组。
        // var ob5 = {
        //     a:1,
        //     b:2,
        //     c:[11,33,44]
        // }

        var ob5 = {
            a:1,
            b:2,
            c:3
        }

        var ob6 = {};

        for(var k in ob5){
            ob6[k] = ob5[k];
        }
        console.log(ob6);  //{a: 1, b: 2, c: 3}

        //对象的深克隆
        var ob7 ={
            a:1,
            b:2,
            c:[111,222,{
                a:1,
                b:2,
                c:[333,444]
            }]
        }

        console.log(ob7);  //{a: 1, b: 2, c: Array(3)}

        //对象、数组的深克隆
        function dgobar(o){
            if(Array.isArray(o)){
            //数组的情况
                var result = [];    
                for(var i=0; i<o.length; i++){
                   result.push(o[i]);
                }
            }else if(typeof(o)=='object'){
            //对象的情况
                var result={};    
                for(var i in o){
                    result[i]=dgobar(o[i]);
                }
            }else{
            //基本的类型的情况    
                result=o;
            }
            return result;
        }
        
        var ob8=dgobar(ob7);
        console.log(ob8);

        //因为深克隆的两个对象已经为两个地址的对象了。所以为false;
        console.log(ob8==ob7);  //false;  

        
    </script>
</body>
</html>
这篇文章对您有用吗?

我们要如何帮助您?