闭包是JS中最基本、最重要的概念之一，闭包绝不是一个单一的概念，它涉及作用域、作用域链、执行上下文、内存管理等多重知识点。
1.作用域
首先是作用域，在ES6之前只有函数作用域和全局作用域之分，ES6中通过let和const声明变量的块级作用域，使得JS的作用域更加丰富。下面说说变量提升和暂时性死区。
下面看个var声明变量的例子
function f1(){
console.log(b);//undefined
var b = 2
}
f1()var声明的变量会提前声明，但是不赋值，所以输出undefined，而这里的var换成let、const的话，会报referenceError错误。原因是let、const声明的变量，在未声明之前的区域会形成一个“死区”，专业名为TDZ（Temporal Dead Zone）它始于函数开头，终于变量声明的语句，在这个“死区”中调用变量都会报错,在死区外就可以正常访问变量。暂时性死区有种极端的情况就是，函数的参数默认值设置也会受它的影响
例子如下
function fan(a1 = a2, a2){
console.log(a1,a2);
}
fan(1,2)
fan(null,2)
fan(undefined,2)调用了三次fan，分别输出什么呢，第一次是1，2，第一次是null，2，第三次报错了。第三次因为传的是undefined，默认没传，a1赋值为a2,但此时a2没有声明，所以报错。
2.执行上下文和调用栈
执行上下文就是当前代码的执行环境/作用域，和作用域相辅相成，但又是俩个完全不同的概念。
2.1 代码执行的俩个阶段
JS代码执行分俩个阶段，一个是代码预编译阶段，一个是代码执行阶段
在预编译阶段，会进行变量的声明，对变量进行提升，但值为undefined，对所有非表达式的函数声明进行提升
在执行阶段，会执行代码逻辑，执行上下文会在这个阶段全部创建完成
下面看个例子
function fbn(){
console.log('a');
}
var fbn = function(){
console.log('b');
}
fbn()这里会输出b,如果调换顺序呢
var fbn = function(){
console.log('b');
}
function fbn(){
console.log('a');
}
fbn()这里输出还是b
为什么呢？因为预编译阶段对fbn进行变量提升，并未赋值，然后对函数fbn进行创建声明，接下来才轮到fbn的赋值，fbn被赋值的内容是函数体为console.log('b')的函数，所以输出b
作用域在预编译阶段确定，，但作用域链是在执行上下文的创建完成生成的，因为函数调用才会创建相应的执行上下文。执行上下文包括变量对象，作用域链及this的指向
2.2 调用栈
在a函数中调用了b函数，在b函数中调用了c函数，这样便形成了一系列的调用栈，a、b、c依次入栈，c执行完出栈，b执行完出栈，最后a执行完出栈，形成调用栈。
正常来讲，在函数执行完毕并出栈时，函数内的局部变量在下一个垃圾回收（GC）节点被回收，该函数的执行上下文会被销毁，这也是外界无法访问函数内定义的变量的原因，也就是说，只有在函数执行时，相关函数才可以访问函数内的变量，变量会在预编译阶段被创建，在执行阶段被激活，在函数执行结束被销毁
3.闭包
讲了这么多前置概念，相信你大概理解闭包的工作原理了吧。
在前述内容中，我们知道正常情况下外界无法访问函数内的变量，函数执行后，其变量会被销毁。但如果在a函数内，返回一个b函数，且这个返回的b函数使用a函数内的变量，那么外界可以通过b函数访问a函数的变量了，这就是闭包的原理。
3.1 内存管理
内存空间分为堆空间和栈空间
undefined，string，null，number，boolean等等基本数据类型存放在栈空间，有固定的内存大小
object、array、function等等引用类型存放在堆空间，内存大小并不固定
3.2 内存泄漏
内存泄漏是指内存空间明明已经不再被使用，但由于某种原因没有被释放的现象。
内存泄漏的危害非常直观，它会导致程序运行缓慢，甚至崩溃
看个例子
var ele = document.querySelector('div')
ele.index = '0'
ele.parentNode.removeChild(ele)这里只是把节点移除了，但变量ele依然存在，该变量占用的内存无法释放
所以应该添加 ele = null 更加稳妥
再来一个例子
var ele = document.querySelector('div')
ele.innerHTML = ''
var btn = document.querySelector('#btn')
btn.addEventListener('click',function(){
//...
})
ele.innerHTML = ''这里button已经在DOM中移除了，但是事件处理句柄还在，该节点变量无法回收，所以还需要添加removeEventListener函数，防止内存泄漏
除了开发者主动保证回收外，大部分场景下浏览器都会依靠标记清除和引用计数俩种算法回收
一个闭包的例子
function fcn(){
let value = 1
function fdn(){
console.log(value);
}
return fdn
}
var fdn = fcn()
fdn()在谷歌浏览器的V8引擎中执行，在fdn函数中设置断点，会发现存在闭包变量value
最后，来个例题实战
var fn = null
const fun = () =>{
var a = 1
function ffn(){
console.log(a);
console.log(b);
}
fn = ffn
}
let bar = () =>{
var b = 2
fn()
}
fun()
bar()运行结果是什么呢，运行结果是 1和ReferenceError：b is not defined，fn被赋值为ffn，变量b并不在它的作用域链上，如果在fun里或全局声明b=2，那便会输出2