通过一个简单例子理解JavaScript闭包和this对象

在JavaScript里，只要有函数，就有闭包。可以说，闭包无处不在。但是，如果提问，“闭包到底是什么”？大多数时候，可能感觉明明心里清楚但苦于说不清楚，“只可意会不可言传”了。

同样，this也是一个很抽象的概念，它往往和闭包一起出现。

我们通过一个例子，并做一些后续的改造，来说说，到底，闭包是什么？this又是如何指定的？

1. 闭包

var number = 1;
function abc() {
    var number = 2;
    function foo() {
        console.log(number);
    }
    return foo;
}
abc()();//输入是什么？

答案是：2.

分析之前，我们需要知道一件事情，函数运行前后，发生了什么？

1. 函数运行时：函数内部的变量都会入栈。 比如abc函数，它被执行时，变量number(=2)入栈。在函数运行期间，number是可以被函数内部的其他方法或者变量访问。
2. 函数运行结束：栈内所有变量被销毁。 一般情况，函数内的变量晚些会被垃圾回收。也就是说，number(=2)这个变量将不存在，永远无法访问。

那么，如果，函数内出现闭包了呢？ 当运行abc函数时，返回值为一个函数，这个函数，就是一个闭包函数。

闭包，指的是一种特殊函数，这种函数会在被调用时保持当时的变量名查找的执行环境

（注：出自《JavaScript编程全解 [（日）》一书）。

现在可以回答文章开头的问题了：

1. 闭包是什么？答：一种特殊函数。
2. 闭包特点是什么？答：被调用时，保留其定义时候的作用域执行环境。

回头看例子，abc()执行完之后，返回foo函数（一个闭包函数）。这时，abc函数本应该被销毁（包括其内部变量），但是由于闭包函数定义在abc内部并且访问到该函数的变量number(=2)，那么，abc无法被销户，其执行环境依旧存在。 运行foo，按照作用域链查找原则，会先访问var number = 2;，自然，最后打印值为2.

综上所述，闭包的作用域环境是函数定义时就决定好的，与运行无关。

现在，我们把上面的题目稍微改动一下：

2. this对象

var number = 1;
function abc() {
    var number = 2;
    function foo() {
        console.log(this.number); // 这里有变化！
    }
    return foo;
}
abc()();//输入是什么？

答案是：1.

有了this搅合，这就不能从闭包的角度分析啦，那么，this是什么？

this是在运行时进行绑定的对象。
this的上下文取决于函数调用时的各种条件。
this的绑定和函数声明的位置没有任何关系，只取决于函数的调用方式。

简单来说，谁调用了函数，那么，函数内部的this就是这个调用者（注意：如果用new关键字调用函数，那么，this默认指向这个新对象）。

回到题目，abc()执行完之后，返回foo函数并运行，相当于：

foo(); // 相当于window.foo()

那么，这个时候，foo函数的调用者是window，即this.number === window.number，自然，输出为1.

其实，this如何绑定，还有其他的方法，比如call, apply, bind，这里就不展开讲了。

小结：

当查看一个函数时，要注意，它是如何访问变量的？！ 变量名称前面有没有this至关重要，如果没有this，那么，多考虑闭包作用域；如果有this，多考虑调用关系。

可见，闭包和this对象并不神秘，不是吗？