閉包的做用域問題

時間 2019-11-17

標籤閉包問題简体版

原文原文鏈接

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
<script type="text/javascript">
    //測試1
    var obj = {name:'haha',data:{value:1}};
    function outer(){
        var objback = obj.data;
        function inner(){
            objback = {}
        }
        return inner;
        
    }
    var f1 = outer();
    f1();
    console.log("測試1",obj) //{name:'haha',data:{value:1}}; 未發生改變

    //測試2

    var obj2 = {name:'haha',data:{value:1}};
    function outer2(){
        var objback = obj2;
        function inner(){
            objback.data = null
            console.log("測試21",JSON.stringify(obj2));   //{name:'haha',data:null}
            objback.name = "asdf";
            console.log("測試22",JSON.stringify(obj2));   //{name:'asdf',data:null}
            objback.data = {};
            
            console.log("測試23",JSON.stringify(obj2)); //{name:'asdf',data:{}}
        }
        return inner;
        
    }
    var f2 = outer2();
    f2();
    console.log("測試2",JSON.stringify(obj2)) //{"name":"asdf","data":{}}
    
    //1,2說明閉包引用的對象的某個對象屬性在閉包中修改後沒法反應到對象中，引用所有對象則能夠反應到對象中

    //測試3
    var obj3 = {name:'haha',data:{value:1}};
    function classA(){
        this.obj = {name:'haha',data:{value:1}};
        this.outer = function(){
            
            var data  =  this.obj.data;
            var data3 = obj3.data;
            function inner(){
                data.value = 2;
                data3={};
            }
            return inner;
        }
        this.test=function(){
            
            console.log("測試3",this.obj.data.value)
        }
    }

    var a = new classA();
    a.outer()();
    a.test();
    console.log("測試3",this.obj3.data)
    //2,3說明閉包引用的對象的某個對象屬性在閉包中修改後沒法反應到對象中，但修改這個對象的對象的某個值能夠反應到對象中，引用所有對象則能夠反應到對象中
    //測試4
     function classB(){
        this.obj = {name:'haha',data:{value:1}};
        this.outer = function(){
            
            var data  = this.obj;
            function inner(){
        
                data.data.value = 2;
                console.log("測試4",data.data.value)
                
            }
            return inner;
        }
        this.test=function(){
    
            console.log("測試4",this.obj.data.value)
        }
    }
    //
    var b = new classB();
    b.outer()();
    b.test();

    var data = {value:10,data:{value:1}};
    console.log(JSON.stringify(data));
    data.data = {};
    console.log(data)
    //總體說明改變變量指向對象的對象屬性，改變這個屬性的指向不會反應到對象自己中，由於變量只是一個數量而已。  是我太蠢
</script>
</body>
</html>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。