闭包的作用域问题

<!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>
闭包的作用域问题

猜你喜欢
