变量作用域
1、变量的作用域
要理解闭包，首先要理解 JavasSript 的特殊的变量作用域。 变量的作用域无非就两种：全局变量和局部变量。 JavasSript 语言的特别之处就在于：函数内部可以直接读取全局变量，但是在函数外部无法读取函数内部的局部变量
注意点： 在函数内部声明变量的时候，一定要使用 var/let 命令。如果不用的话，你实际上声明的是一个全局变量！
let c = "this window"
function f6() {
console.log(c) //读取全局变量c
}
f6() // this window
function f7() {
d = "123" //声明了全局变量
}
f7()
console.log(d) //123
2、如何从外部读取函数内部的局部变量？
出于种种原因，我们有时候需要获取到函数内部的局部变量。但是，上面已经说过了，正常情况下，这是办不到的！只有通过变通的方法才能实现。
那就是在函数内部，再定义一个函数。
function f1(){
var n=999;
function f2(){
alert(n); // 999
}
}
在上面的代码中，函数 f2 就被包括在函数 f1 内部，这时 f1 内部的所有局部变量，对 f2 都是可见的。但是反过来就不行，f2 内部的局部变量，对 f1 就是不可见的。
这就是 JavasSript 语言特有的"链式作用域"结构（chain scope），子对象会一级一级地向上寻找所有父对象的变量。所以，父对象的所有变量，对子对象都是可见的，反之则不成立。
既然 f2 可以读取 f1 中的局部变量，那么只要把 f2 作为返回值，我们不就可以在 f1 外部读取它的内部变量了吗！
function f1(){
var n=999;
function f2(){\
alert(n);\
}
return f2;
}
var result=f1();
result(); // 999
3、闭包的概念
上面代码中的 f2 函数，就是闭包。
各种专业文献的闭包定义都非常抽象，我的理解是: 闭包就是能够读取其他函数内部变量的函数。
由于在 JavasSript 中，只有函数内部的子函数才能读取局部变量，所以说，闭包可以简单理解成"定义在一个函数内部的函数"。
所以，在本质上，闭包是将函数内部和函数外部连接起来的桥梁。
4、闭包的用途
闭包可以用在许多地方。它的最大用处有，一个是前面提到的可以访问其他函数内部的变量；另一个就是保护变量不被内存回收机制回收，让这些变量的值始终保持在内存中，不会在 f1 调用后被自动清除；以及避免全局变量被污染 方便调用上下文的局部变量 加强封装性
为什么会这样呢？原因就在于 f1 是 f2 的父函数，而 f2 被赋给了一个全局变量，这导致 f2 始终在内存中，而 f2 的存在依赖于 f1，因此 f1 也始终在内存中，不会在调用结束后，被垃圾回收机制（garbage collection）回收。
function f1(){
var n=999;
nAdd=function(){n+=1}
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
nAdd();
result(); // 1000
这段代码中另一个值得注意的地方，就是 "nAdd=function(){n+=1}" 这一行，首先在 nAdd 前面没有使用 var 关键字，因此 nAdd 是一个全局变量，而不是局部变量。其次，nAdd 的值是一个匿名函数（anonymous function），而这个匿名函数本身也是一个闭包，所以 nAdd 相当于是一个 setter，可以在函数外部对函数内部的局部变量进行操作。
5、使用闭包的注意点
- 由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。解决方法是，在退出函数之前，将不使用的局部变量全部删除。
- 闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值。
注意避坑
1.引用的变量可能发生变化
function outer() {
var result = [];
for (var i = 0; i<10; i++){
result[i] = function () {
console.info(i)
}
}
return result
}
let dat = outer()
dat.forEach(item => {item()}) //输出全部为10
由于每个闭包访问的变量i都是outer执行环境显得变量i，循环结束后 i为10，所以每个闭包函数执行结果都为10
解决方法
function outer() {
var result = [];
for （var i = 0； i<10; i++）{
result.[i] = function (num) {
return function() {
console.info(num); // 此时访问的num，是上层函数执行环境的num，数组有10个函数对象，每个对象的执行环境下的number都不一样
}
}(i)
}
return result
}
2.this指向问题
var object = {
name: 'name',
getName: function () {
return function () {
console.info(this.name)
}
}
}
object.getName()() // underfined
// 因为里面的闭包函数是在window作用域下执行的，也就是说，this指向windows
3.闭包引起的内存泄漏与避免
一般来讲，当函数执行完毕后，局部活动对象就会销毁，内存仅保存全局作用域。但是，闭包的情况不同，闭包函数执行完毕后，其活动对象不会销毁，因为匿名函数的作用域链仍然引用这个活动对象。直到匿名函数被销毁后，闭包函数的活动对象才会被销毁。由于闭包会携带包含它的函数的作用域，因此会占用更多的内存，过度的使用闭包会导致内存占用过多。
跟闭包和内存泄漏有关系的地方是，使用闭包的同时比较容易形成循环引用，如果闭包的作用域链中保存着一些 DOM 节点，这时候就有可能造成内存泄露。但这本身并非闭包的问题，也并非 JavaScript 的问题。
1、在退出函数之前，将不使用的局部变量全部删除。可以使变量赋值为null;
function showId() {
var el = document.getElementById("app")
el.onclick = function(){
aler(el.id) // 这样会导致闭包引用外层的el，当执行完showId后，el无法释放
}
}
// 改成下面
function showId() {
var el = document.getElementById("app")
var id = el.id
el.onclick = function(){
aler(id) // 这样会导致闭包引用外层的el，当执行完showId后，el无法释放
}
el = null // 主动释放el
}
2、避免变量的循环赋值和引用
闭包可能会导致在不经意间创建循环引用。因为函数是必须保存在内存中的对象，所以位于函数执行上下文中的所有变量也需要保存在内存中：
function outerFn() {
var outerVar = {};
function innerFn() {
console.log(outerVar);
}
outerVar.fn = innerFn;
return innerFn;
};
这里创建了一个名为 outerVar 的对象，该对象在内部函数innerFn()中被引用。然后，为 outerVar 创建了一个指向 innerFn()的属性，之后返回了innerFn()。这样就在 innerFn() 上创建了一个引用outerVar的闭包，而outerVar又引用了innerFn()。
