这段空闲时间，打算整理一些JS非常基础，但是又常常搞不清记不住的知识点。
第一篇，先整理一下JS的函数，特别是闭包的知识。
函数的定义
闭包的本质还是函数，那么先来看看如何定义一个函数：
-
函数声明：声明一个变量，把函数对象赋值给它，会提升到脚本、代码块顶部
function f(x){ return x; }
-
函数表达式：不会声明变量，不会提升
let f = function(x){ return x; }
-
箭头函数：从定义自己的环境继承this的值
let f = (x,y)=>{ return x+y; }
词法作用域
词法作用域(lexical scoping)规则：JavaScript函数执行时，使用的是定义函数时生效的变量作用域，而不是调用函数时生效的变量作用域。
let scope = "global scope"; // 全局变量
function checkScope(){
let scope = "local scope": // 局部变量
function f(){ return scope; } // 返回当前作用域中的值
return f();
}
checkScope(); //返回什么？
以上代码，
- 创建了一个全局变量
scope，赋值为"global scope"； - 声明了一个新的变量
checkScope，并且定义一个新的函数对象赋值给checkScope； - 从全局执行上下文中查找变量
checkScope，并作为函数执行； - 函数调用创建新的执行上下文(
checkScope函数执行上下文)； - 在
checkScope函数执行上下文中：- 创建局部变量
scope，赋值为"local scope" - 声明变量
f，并把函数对象赋值给f - 调用f函数，
-
checkScope函数执行上下文查找scope，返回scope的值"local scope" - 把
f函数返回的东西(即"local scope")作为checkScope函数的返回
- 创建局部变量
- 最后输出"local scope"
再看看以下例子：
let scope = "global scope";
function checkScope(){
let scope = "local scope":
function f(){ return scope; }
return f;
}
checkScope()(); //返回什么？
两个例子有什么分别呢？
第一个例子中，checkScope()返回的时f()调用后的值；
第二个例子中，checkScope()返回的是一个嵌套函数f()，而且()转移到了外部，函数外部调用这个嵌套函数。
返回值会不会变成"global scope"？运行一下可以看到结果依然是"local scope"
分析：根据词法作用域规则，定义嵌套函数f()时，变量scope绑定的值是"local scope"，该绑定在f()执行时仍然有效，无论它在哪里执行。
嵌套函数f()创建了一个闭包，闭包的一个强大性质：会捕获自身定义所在外部函数的局部变量（及参数）绑定。
严格来说，所有函数都是闭包，但是，由于多数函数调用和函数定义都在同一作用域内，所以闭包的存在无关紧要。对于上面的例子，存在嵌套函数，而且外部函数返回的时函数的时候，闭包的概念就变得重要。
闭包
闭包(closure)：一个函数和对其周围状态（lexical environment，词法环境）的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包（closure)
闭包有什么用呢？
模拟私有方法
闭包可以捕获一次函数调用的局部变量，可以将这些变量作为私有状态
let f = (function(){
let counter = 0; // 以下函数的私有状态
return function() { return counter++; } // 返回一个函数
}())
f(); // 0
f(); // 1
第一行定义并调用一个函数，把函数的返回值赋给f，返回值是一个匿名函数，这个嵌套的函数有权访问其作用域的变量，而且可以使用用定义在外部函数的变量counter，外部函数一旦返回，就没有别的代码可以看到counter了，这时这个嵌套函数拥有对它的专有访问权。
使用闭包，我们就可以模拟Java，创建私有属性。
let counter = (function(){
let n= 0;
return {
count: function() {return n++;},
reset: function() { n=0;},
value: function() { return n;}
}
})();
counter.count();
counter.count();
counter.reset();
counter.count();
counter.value();
以上的例子可以看到，同一个外部函数中定义多个嵌套函数，它们共享作用域。
再来看一下，修改一点代码
let makeCounter = function(){
let n= 0;
return {
count: function() {return n++;},
reset: function() { n=0;},
value: function() { return n;}
}
};
let counter1 = makeCounter();
let counter2 = makeCounter();
counter1.count();
counter1.reset();
counter1.count();
counter1.value();
counter2.value();
两个计数器 Counter1 和 Counter2相互独立，因为每次调用makeCounter()的时候，都会改变变量的值。每个闭包都是引用自己词法作用域内的变量，在一个闭包内对变量的修改，不会影响到另外一个闭包中的变量。
注意：在循环中创建闭包
function f(){
let funcArray = [];
for(var i=0; i < 10; i++){
funcArray[i] = () => i;
}
return funcArray;
}
let funcs = f();
funcs[3](); // 结果是3吗？
结果：10
分析：f()中创建是10个闭包，它们共享同一个var声明的变量i，for循环结束时，i的值是10。因为闭包关联的作用域是活的，所以10个闭包都共享了10个这值。
解决：把var改成let，因为通过var声明的变量作用域是整个函数体，ES6后增加的let和const的作用域是块极的，每次循环都会定义一个与其它循环不同的独立作用域。
function f(){
let funcArray = [];
for(let i=0; i < 10; i++){
funcArray[i] = () => i;
}
return funcArray;
}
let funcs = f();
funcs[3](); // 3
funcs[7](); // 7
使用闭包时还需要注意一个问题：
- 箭头函数：会继承包含它们的函数中的this值，使用箭头函数创建的闭包可以访问外部的this值；
- function：它的this值指向全局对象或者undefined
参考以下三个例子：
// 例子1
let o = {
a: 1,
m: function(){
function f() { return this.a; }
return f();
}
}
o.m(); // undefined
// f()中的this => Window {0: global, window: Window, self: Window, document: document, name: "", location: Location, …}
// 例子2
let o = {
a: 1,
m: function(){
f = () => this.a;
return f();
}
}
o.m(); // 1
// 箭头函数中的this => {a: 1, m: ƒ}
// 例子3
let o = {
a: 1,
m: function(){
let self = this; // 把this的值保存在变量中，让以下嵌套函数可以访问外部this的值
function f() { return self.a; }
return f();
}
}
o.m(); // 1
