闭包的概念

函数和其周围的状态的引用捆绑在一起形成闭包；
可以在另一个作用域中调用一个函数的内部函数并访问到该函数的作用域中的成员。
更详细的介绍参见MDN

闭包案例分析

题目
某员工工资由基础工资加绩效工资构成，但不同等级员工的基础工资不一样，一级员工基础工资12000，二级员工工资15000，绩效工资不定。
那么按照面向过程编程思路大部分人会得到函数如下：

function getSalary(base, performance) {
    return base + performance;
}

//不同级别员工的工资获取调用方法
getSalary(12000, 2000)
getSalary(15000, 3000)
getSalary(12000, 4000)
getSalary(15000, 5000)

那么上面在计算同一级别员工工资时，他们基数都一样，所以为什么不把基数工资也做为一个固定参数保留下来使用呢，将上面代码进行改造

function makeSalary(base) {
    return function (performance) {
        return base + performance;
    }
}
//这里使用高阶函数，使代码更简洁；同时函数功能更灵活
let getSalary1 = makeSalary(12000);
let getSalary2 = makeSalary(15000);
console.log('一级员工甲的薪资', getSalary1(3000));
console.log('二级员工乙的薪资', getSalary2(5000));

接下来看看闭包在函数运行时的体现

result.jpg

1.jpg

2.jpg

3.jpg

4.jpg

5.jpg

PS: 图5中，如是var定义的变量，那么是保存在global对象中的。

上面截图是通过断点一步一步跟踪，可以看到函数运行过程中调用栈和作用域的变化，也体现了闭包机制

注意：
如果一个闭包的函数定义了一个和外部函数的某个变量名称相同的变量，那么这个闭包将无法引用外部函数的这个变量