js闭包(1)

先看一个例子

function add(){
    var count = 0;
    function demo(){
        count++;
        console.log(count);
    }
    return demo;
}
var counter = add();
counter();
counter();
counter();
counter();
counter();

先猜一下结果。
按理来说,虽然是连续执行函数,但是应该每次调用demo都是从0开始加上1,
也就是结果应该是连续打印五个1。
但是事实上打印结果是1 2 3 4 5
原因是什么呢?
我们分析一下执行情况
add():
(add) AO{ count = 0; demo = function demo(){} }

demo() :
(demo)AO{}
(add)AO{ count = 0; demo = function demo(){}}
在执行demo时,demo自己的AO里面没有count,所以只能用add()里面的,而执行结束后会立刻销毁自己的AO,所以执行完之后是这样的:

add():
(add) AO{ count = 0; demo = function demo(){} }

demo() :
(demo)AO{}
(add)AO{ count = 1; demo = function demo(){}},

而题中通过return的形式把demo()保存到了外部。这样,demo()的作用域链也就得以保存。即再次调用demo()时将会是在count == 1的基础上实现,那么后来的结果就显而易见了。
那如果我们这么改一下:

function add(){
    var count = 0;
    function demo(){
        count++;
        console.log(count);
    }
    return demo;
}
add()();
add()();
add()();
add()();
add()();
add()();

怎么样?结果会不会发生改变呢?
是会的。因为return出来的demo()并没有被存下来,所以答案将会是我们第一次预测的结果,1 1 1 1 1

现在我们可以说了,上面的现象就是闭包造成的。

当内部函数被保存到外部时,会生成一个闭包。

了解立即执行函数的话可以直接看闭包2

猜你喜欢

转载自blog.csdn.net/q1378465762/article/details/81231924