闭包和this 完全理解js中this的指向,没必要硬背。

function create(){
        var result =new Array();
        for(var i=0;i<10;i++){
            result[i]=function(){
                return i;
            }
        }
        return result;
    }

网上不少讲解,可是看完之后老是似懂非懂,今天又看了一遍高程,说说本身的见解。html

最后输出数组会获得数组

 result=[10,10,10,10,10,10,10,10,10,10];

与想获得的结果闭包

 result=[0,1,2,3,4,5,6,7,8,9]

相差甚远,说一下缘由:函数

create函数内部的闭包能够经过做用域访问到外部函数create中的变量i,当函数create执行完之后i最后的值是10。post

而当console.log(result)数组的时候 本质上是打印this

result=[function(){return i;},function(){return i;},.....function(){return i;}]

数组中十个匿名函数的结果,由于是引用类型,只能访问到create执行之后i的值。所以是10;url

 


 

解决方法仍是不少的spa

书上的方法code

 function create(){
        var result =new Array();
        for(var i=0;i<10;i++){
            result[i]=function(mun){
                return function(){
                    return mun;
                }
            }(i);
        }
        return result;
    }

能够返回预期值,而后我又尝试了一下htm

function xh(){
        let sz=[];
        for(var i=0;i<10;i++){
            sz[i]=function(i){
                return i;
            }(i);
        }
        return sz;
    }

本质上的区别仍是数组中保存了匿名函数\数值;

稍经尝试就能够得出结果。

固然少不了let 声明变量i的方法。

 


 

关于this对象

有关于this的讲解,追梦子大大讲的很详细,这里贴出连接:完全理解js中this的指向,没必要硬背。

这里说一下高程中的例子

  var name='window';
    let obj={
        name:'obj',
        get:function(){
             return function (){
                return this.name;
            }
        }
    };
    alert(obj.get()());//window

而后贴出书中的讲解:

前面曾经提到过,每一个函数在被调用的视乎都会自动取得两个特殊变量:this 和 arguments。内部函数在搜索着两个变量时,智慧搜索 到其活动对象位置,所以永远不可能直接访问外部函数中的这两个变量。

上面这句话我仍然没读懂。

说一下本身的理解:

alert(obj.get()());

弹出obj.get()

alert(obj.get());

会获得

function (){
    return this.name;
}

所以alert(obj.get()());只不过是匿名函数在全局里的执行,会返回window的name属性。

来验证本身的想法,将函数进行修改

var name='window';
    let obj={
        name:'obj',
        get:function(){
             return function (){
                return obj.name;
            }
        }
    };
    alert(obj.get()());//obj

能够访问到obj里的name属性,由此能够看出上边获得的结论是正确且符合逻辑。在匿名函数的做用域中window的name属性相对于obj的name属性更近一些。


 

 

若是能帮到你,不胜荣幸。

相关文章
相关标签/搜索