javascript之闭包(closure)

2017-01-06  本文已影响34人  陈川Lethe

闭包,这个名字好奇怪,
言归正传,先说一下js函数的变量作用域
以下例子全部基于局部变量

函数内部访问函数外部变量

demo1:

    var a = 100;
    function get() {
        console.log(a)
    }
    get();
    // 运行结果:100

在demo1例子中,变量a是在函数外部声明的,在函数get()当中是可以调用到的,调用get()函数,在浏览器控制台会输出100,也就是a的值。

函数外部访问函数内部声明的变量

demo2:

    function get() {
        var a = 100;
    }
    get();
    console.log(a);
    //运行结果:ReferenceError: a is not defined

在demo2例子中,变量a在函数get()中声明,执行函数get()执行之后,调用变量a,在控制台输出:ReferenceError: a is not defined(a没有被定义),可见,在函数外部是无法直接调用函数内部声明的变量的。
难道就没法获得到函数内部到变量来么?当然不是,这时候闭包就派上用场来,看如下代码:

    function get() {
        var a = 100;
        return function () {
            return a;
        }
    }
    var b = get();
    console.log(b);
    //运行结果:
    /* function () {
        return a;
    }*/
    console.log(b());
    // 运行结果:100

函数get()中返回一个函数,这个函数返回你想要获得到到变量,然后在函数外部就可以通过get()()就可以获得到函数内部到变量的值了,😄。

再来看阮老师博客里的两个例子:

    var name = "The Window";
    var object = {
        name : "My Object",
        getNameFunc : function(){
            return function(){
                return this.name;
            };
        }
    };
    console.log(object.getNameFunc()());
    //输出结果:    (编者注:什么也没有输出)
    var name = "The Window";
    var object = {
        name : "My Object",
        getNameFunc : function(){
            var _this = this;
            return function(){
                return _this.name;
            };
        }
    };
    console.log(object.getNameFunc()());
    //输出结果:My Object

拓展阅读:

阮一峰:学习Javascript闭包(Closure)

上一篇 下一篇

猜你喜欢

热点阅读