淺拷貝與深拷貝程式碼(javascript)

羊陽洋丶發表於2020-09-30
JavaScript
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 淺拷貝只拷貝第一層,深一層的只拷貝拷貝地址
        var b={
            id:1,
            name:"name",
            msg:{
                age:20
            }
        }
        //老方法迴圈淺拷貝
        var o={};
        for (var k in b){
            o[k]=b[k];
        }
        console.log(o);
        // msg屬於深一層,所以拷貝地址,一個改變了就都改變,o裡面也會變
        o.msg.age=2;
        console.log(b);
        // Object.assign是淺拷貝的方法,將後面的拷貝進第一個
        Object.assign(o,b);
        console.log(o);
        console.log("---深拷貝deepCopy---");
        var obj={
            id:1,
            name:"andy",
            msg:{
                age:18
            }
        }
        var ob={}
        //深拷貝全部拷貝,而且不會因為值改變而改變值.
        function getDeep(newObject,oldObject){
            for (var k in oldObject){
                if (oldObject[k] instanceof Array){
                    newObject[k]=[];
                    getDeep(newObject[k],oldObject[k]);
                }else if (oldObject[k] instanceof Object){
                    newObject[k]={};
                    getDeep(newObject[k],oldObject[k]);
                }else{
                    newObject[k]=oldObject[k];
                }
            }
        }
        getDeep(ob,obj);
        console.log(ob);
    </script>
</body>
</html>

相關文章