深入理解javascript闭包

闭包在javascript中是一个非常重要但又难以掌握的概念。已经学习和使用javascript一年半之久，还是完全不理解闭包是什么。今天开始认真理一下。

闭包使得函数可以继续访问定义时的词法作用域。

在学习js闭包之前，首先需要了解一个概念，词法作用域。

一、 词法作用域

作用域分为词法作用域（大多数编程语言所采用的）和动态作用域（Bash脚本，Perl）。

1. 词法阶段

大部分标准语言编译器的第一个工作阶段，叫做词法化（也加单词化）。词法化的过程会对源代码的字符进行检查，如果是有状态的解析过程，还会赋予单词语义。

2. 词法作用域气泡

简单的说，词法作用域就是定义在词法阶段的作用域。换句话说，词法作用域是由你在写代码时将变量和快作用域写在哪里决定的，因此词法分析器在处理代码时会保持作用域不变。

二、作用域闭包

在javascript中，闭包无处不在。闭包是基于词法作用域书写代码时所产生的自然结果。闭包的使用和创建在代码中随处可见，我们缺少的是一双识别闭包的眼睛和一颗想要拥抱闭包的心。你可能会蓦然发现，你的代码中到处都是闭包。

当函数记住并访问所在的词法作用域时，就产生了闭包。即使函数是在当前词法作用域之外执行。

下面这段代码清晰的展示了闭包：

示例1：将内部函数作为结果return出来

function foo() {
    let a = 2;

    function bar() {
        console.log(a);
    }
    return bar;
}
let baz = foo();
baz(); // 2 --->闭包产生的效果

在上述代码中我们把foo()这个函数的执行结果，也就是bar这个函数直接赋值给baz， 然后调用baz() ，实际上只是通过不同的标识符引用调用了内部的函数bar()。在这个例子中，bar()可以在自己定义的词法作用域以外的地方执行。
正常情况下，执行完foo（），通常我们认为foo（）的整个内部作用域都会被销毁。因为引擎有垃圾回收器，会自动释放不再使用的内存空间。虽然看上去foo（）的内容不会再被使用。
但是，在这里，由于闭包，事实上内部作用域依然存在。因为bar（）本身还在使用这个内部作用域。

因为bar()声明位置的原因，它拥有涵盖foo()内部作用域的闭包，使得该作用域能够一直存活，以供bar()以后在之后的任何时间都可以使用。

示例2：直接将函数传递到所在的词法作用域外

function foo() {
	var a = 2;
	function baz() {
		console.log( a ); // 2
	}
	bar( baz );
}
function bar(fn) {
	fn(); //这就是闭包！在这里baz（）已经被传递到了定义时所在的词法作用域以外。
}

示例3：将函数赋值给全局变量，将内部函数传递到所在的词法作用域外。

var fn;
function foo() {
	var a = 2;
	function baz() {
		console.log( a );
	}
	fn = baz; // 将baz 分配给全局变量
}

function bar() {
	fn(); //这就是闭包！
}

foo();
bar(); // 2

综上，无论使用何种方法，只要将内部函数传递到所在的词法作用域外，它都会保持对原始定义作用域的引用，无论在何处执行都会使用这个闭包。

四、循环和闭包

for (var i=1; i<=5; i++) {
	setTimeout( function timer() {
		console.log( i );
	}, 1000 );
}

上述代码每隔1s输出一个6，一共输出5个6。
我们试图假设循环中的每个迭代在运行时都会给自己“捕获”一个i 的副本。但是 根据作用域的工作原理，实际情况是尽管循环中的五个函数是在各个迭代中分别定义的， 但是它们都被封闭在一个共享的全局作用域中，因此实际上只有一个i。

五、模块和闭包

六、无处不在的闭包

1.for 循环

function wait(message) {
	setTimeout( function timer() {
		console.log( message );
	}, 1000 );
}
wait( "Hello, closure!" );

2.jQuery

function setupBot(name, selector) {
	$( selector ).click( function activator() {
		console.log( "Activating: " + name );           //闭包
	} );
}
setupBot( "Closure Bot 1", "#bot_1" );
setupBot( "Closure Bot 2", "#bot_2" );

本质上，无论何时何地，如果将函数（访问各自的词法作用域）当成一个第一级的值类型，到处传递，那就会有闭包在这些函数中的应用。因为作为值类型时，它拥有和普通变量一样的作用域。

事实上，只要使用了定时器、事件监听器、Ajax请求、跨窗口通信、Web Worker或者其他任何的异步（或者同步）任务中，只要使用了回调函数，实际上就是在使用闭包。

参考：《你不知道的JavaScript（上卷）》