前言
闭包可以说是最最最最最最常见的面试题之一了，很多人面试的时候都被问到过闭包的知识,闭包的概念是什么?闭包的好处和坏处是什么?闭包有哪些应用场景了?
前两天朋友面试的时候也被问到过这个问题，网上的答案也有很多:有的说能够读取其他函数内部作用域的函数就是闭包，也有的说所有的函数都是闭包，哪怕是全局作用域上的，因为它能获取到全局作用域上的变量…答案也是很不统一，这就让还是新手的我对于答案有点举棋不定了，于是重温了一下《你不知道的javascript上卷》和《javascript高级程序第四版》，看了一下这两本书对于闭包的解释，记录一下相关知识，希望能够帮助到大家。
初始闭包
《你不知道的javascript》 javascript中闭包无处不在，你只需要能够识别并拥抱它。 闭包就是基于词法作用域的，你在书写代码的时候产生的一种现象。
当函数能够记住并访问自己所在的词法作用域的时候就产生了闭包
function foo(){
var a = 2;
function bar(){
console.log(a) //2
}
}
foo()
上述的这段代码中，bar可以说也是一个闭包，因为它能够访问到他所在的作用域里面的变量。但是他却是封闭在foo里面的，就相当于一个词法作用域的查找规则而已，自己的作用域没找到，去上一个作用域找。也是闭包的一部分
function foo(){
var a = 2;
function bar(){
console.log(a)
}
return bar
}
var baz = foo()
baz() //2 -----------这才是闭包的效果
我们将bar函数传递出去，然后调用foo函数的时候赋值给baz，调用baz就相当于调用了内部的bar函数了，而且bar相当于在自己所在的词法作用域之外执行了。foo函数执行之后，正常的话内部的作用域会被销毁，垃圾回收机制也会释放不再使用的内存空间，但是闭包可以阻止这种事情，让foo内部的作用域依然存在着。这样以供bar函数在后面的任何地方，任何时间引用
bar函数依然持有对这个作用域的引用，这个引用就叫闭包。
无论我们以何种的方式将bar这个函数传递出去
function foo() {
var a = 2;
function bar() {
console.log( a ); // 2
}
baz( bar);
}
function baz(fn) {
fn(); // 作为参数传递出去 这也是闭包
}
var fn;
function foo() {
var a = 2;
function bar() {
console.log( a );
}
fn = baz; // 直接赋值给全局变量fn
}
function bar() {
fn(); // 这也是闭包
}
foo();
baz(); // 2
上面这几组代码，有将函数作为参数传递出去的，也有将函数赋值给一个全局变量的，都让这个函数可以在词法作用域之外调用了，都是闭包。包括我们平时使用的一些计时器，定时器，事件监听器这些使用了回调 函数，都是闭包的应用
function getName(name){
setTimeout( function timer() {
console.log(name);
}, 1000 );
}
getName('小明')
//将一个内部函数timer传递给setTimeout，timer具有涵盖getName的闭包，还有这对name的引用
for循环与闭包
我们经常使用for循环
for (var i=1; i<=5; i++) {
setTimeout( function timer() {
console.log( i );
}, i*1000 );
}
上述这段代码中，正常情况下我们想打印 1,2,3,4,5，但是事实上却以每秒一次的频率打印了五次6，6是从哪来的那？这个循环的终止条件是 i 不在<=5，所以首次成立条件的时候 i 就是6，打印的就是循环结束时候的值？这是为什么?
虽然这个timer函数在每次迭代的时候都定义一次，相当于定义了五个，但是都封闭在一个共享的全局作用域下面，就相当于只有一个i，根据js中setTimeout的运行机制来看，也是正常的。
那我们得如何处理那?我们可以在每次迭代的时候都创建一个作用域，这个样的话就不是在一个全局作用域了。
for (var i=1; i<=5; i++) {
(function() {
setTimeout( function timer() {
console.log( i );
}, i*1000 );
})();
}
我们先尝试使用了一下自执行函数来创建作用域。
还是不行…
我们可以在每次迭代的时候创建一个块级作用域
for (let i=1; i<=5; i++) {
setTimeout( function timer() {
console.log( i );
}, i*1000 );
}
我们使用到了es6 中的let定义变量，在每次迭代的时候都创建一个块级作用域，这样是可以的
闭包的应用场景
闭包有什么应用场景?比如定时器，回调函数，防抖函数....很多都是用到了闭包
我们还可以封装私有变量
(function() {
// 私有变量和私有函数
let privateVariable = 10;
function privateFunction() {
return false;
}
// 构造函数
MyObject = function() {
};
// 公有和特权方法
MyObject.prototype.publicMethod = function() {
privateVariable++;
return privateFunction();
};
})();
var obj = new MyObject()
obj.publicMethod () //false
比如上面这种，我们使用一个自执行函数封装私有变量，创建一个构造函数表达式，我们没有用var定义，说明是一个全局的，在构造函数的原型上创建了一个publicMethod函数方法，这个函数就可以访问这个函数的词法作用域，就是一个闭包
我们也可以使用模块模式创建，返回一个单例对象
function singleton() {
// 私有变量和私有函数
let privateVariable = 10;
function privateFunction() {
return false;
}
// 特权/公有方法和属性
return {
publicProperty: true,
publicMethod() {
privateVariable++;
return privateFunction();
}
};
}
var foo = singleton();
foo.publicMethod() //false
singleton函数返回了一个对象，相当于一个模块实例,这个对象里面的publicMethod函数具有涵盖模块实例内部作用域的闭包，singleton函数也可以是自执行函数
小结
当函数可以记住并访问所在的词法作用域，即使函数是在当前词法作用域之外执行，这时就产生了闭包。闭包也是一个非常强大的工具，可以用多种形式来实现模块等模式。
闭包也会出现也写问题，比如将把HTML元素保存在某个闭包的作用域中，就相当于宣布该元素不能被销毁。或者是你把函数return出来后 他就给 window了所以一直存在内存中。会造成内存泄露。
function Handler() {
let element = document.getElementById('element');
let id = element.id;
element.onclick = () => console.log(id);
element = null;// 将element设置为null，解除对这个对象的引用，其引用计数也会减少，从而确保其内存可以在适当的时候被回收。
}
参考资料:
《你不知道的javascript》上卷
《javascript高级程序设计第四版》
转载：https://blog.csdn.net/qq_42736311/article/details/115573668