zoukankan      html  css  js  c++  java
  • 从javascript的两个例子谈开

    今天是研究javascript的闭包问题,看到这么一个非常好的文章

    http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html?20110419152835

    文章最后留了两个题目:

    如果你能理解下面两段代码的运行结果,应该就算理解闭包的运行机制了。

    代码片段一。

    var name = "The Window";

    var object = {
    name : "My Object",

    getNameFunc : function(){
    return function(){
    return this.name;
    };

    }

    };

    alert(object.getNameFunc()());

    代码片段二。

    var name = "The Window";

    var object = {
    name : "My Object",

    getNameFunc : function(){
    var that = this;
    return function(){
    return that.name;
    };

    }

    };

    alert(object.getNameFunc()());

    这两个例子相当精简

    这里记录下对这两个例子的理解:

    理解最后两个例子:

    1 函数中的this指的是调用这个函数的owner
    2 object.getNameFunc()是返回一个函数,并没有执行函数中的代码
    3 增加一个例子0:
    var name = "The Window";
    var object = {
    name : "My Object",
    getNameFunc : function(){
    return (this.name);
    }
    };
    var name = object.getNameFunc();
    alert(name);

    4 把例子1变成
    var name = "The Window";
    var object = {
    name : "My Object",
    getNameFunc : function(){
    return function(){
    return this.name; //这个this是有上下文的限制的
    };
    }
    };
    var tmp = Object.getNameFunc(); //此时没有执行this.name
    var name = tmp();//这个时候才执行,这时候的this上下文为全局
    alert(name);
    //alert(object.getNameFunc()())

    5 把例子2变成:
    var name = "The Window";

    var object = {
    name : "My Object",

    getNameFunc : function(){
    var that = this;
    return function(){
    return that.name;
    };
    }
    };
    var tmp = Object.getNameFunc(); //这个时候执行了that = this,这里的this上下文是object,所以that指的是object
    var name = Object.getNameFunc(); //这个时候执行了that.name
    alert(name);
    //alert(object.getNameFunc()());

    这里面最难理解的应该是this的上下文

    实时了解作者更多技术文章,技术心得,请关注微信公众号“轩脉刃的刀光剑影”

    本文基于署名-非商业性使用 3.0许可协议发布,欢迎转载,演绎,但是必须保留本文的署名叶剑峰(包含链接http://www.cnblogs.com/yjf512/),且不得用于商业目的。如您有任何疑问或者授权方面的协商,请与我联系

  • 相关阅读:
    SpringBoot实现原理
    常见Http状态码大全
    forward(转发)和redirect(重定向)有什么区别
    1094. Car Pooling (M)
    0980. Unique Paths III (H)
    1291. Sequential Digits (M)
    0121. Best Time to Buy and Sell Stock (E)
    1041. Robot Bounded In Circle (M)
    0421. Maximum XOR of Two Numbers in an Array (M)
    0216. Combination Sum III (M)
  • 原文地址:https://www.cnblogs.com/yjf512/p/2021018.html
Copyright © 2011-2022 走看看