闭包是什么？如何理解闭包？

一 . 什么是闭包？

官方解释：闭包是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。（函数就是一个表达式）

  JavaScript中所有的function都是一个闭包。不过一般来说，嵌套的function所产生的闭包更为强大，也是大部分时候我们所谓的“闭包”。

听起来好像什么都说了又好像什么也没说...

接下来我们分步去解析它。

1. 首先知道匿名函数的使用

在JavaScript中万事万物都是对象，那么函数也是个对象，则匿名函数也是个对象。

函数的返回值可以是任意类型，那么也可以是一个对象。

    function fun(){

        //匿名函数作为函数的返回值
        return function(){

        };
    }

2. 自运行函数：一个匿名函数在定义完自动运行

    // 匿名函数自运行的写法：

    // 第一种写法
    //这是jslint推荐的写法，好处是，能提醒阅读代码的人，这段代码是一个整体。
    (function () {
        console.log("第一种写法");
    }());

    // 第二种写法
    (function () {
        console.log("第二种写法");
    })();

    // 第三种写法
    ! function(){
        console.log("第三种写法");
    }();

    // 第四种写法
    void function(){
        console.log("第四种写法");
    }();

3.闭包的写法

前提：如何统计一个函数的调用次数？

    function fun(){  
        let count = 0;
        console.log(++count);// 1 
    }
    fun();
    fun();
    fun();
    fun();
    fun();
    //由于 调用函数时创建函数作用域，函数执行完毕，函数作用域销毁
    //每调用一次函数作用域就会创建一个新的函数作用域，他们之间是相互独立的   所以count始终为1



    //在函数作用域中可以访问到全局变量
    //全局作用域中无法访问函数作用域的变量 , 由作用域链的特性可以使用全局变量统计次数
    let count = 0;
    function fun(){  
        console.log(++count);
    }
    fun();
    fun();
    fun();
    fun();
    fun();

问题: 那么如何在函数体外访问局部变量？

用 闭包 实现：

    function f1(){   
        var count = 0;
        var f2 = function(){
            ++count;
            return count;
        }
        return f2;
    }

    let f = f1();//f1() == f2 == f
    console.log(f());//f() == f2()
    console.log(f());
    console.log(f());

1.在主函数(f1)中定义内部变量(count),及子函数(f2)

2.在子函数(f2)中使用主函数(f1)的内部变量(count)

3.将子函数(f2)作为主函数(f1)的返回值

4.在外界通过全局变量f绑定了f1的返回值f2

5.从而延长了f2的生命周期，使得count可以在f1外界使用

如上 便是一个完整的闭包

通过以上了解，那么究竟什么是闭包呢？

闭包的概念：

闭包是指 在函数外部访问函数作用域中的变量(局部变量)的函数；

或者说 闭包就是能够读取其他函数内部变量的函数；

或者说 闭包是指有权访问另一个函数作用域中的变量的函数；

由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。

闭包的缺陷：

打破了垃圾回收机制

延长了局部变量的声明周期

使用闭包可能会造成内存泄露

进阶写法

    // 变形
    function f1(){
        var count = 0;
        return function(){
            return ++count;
        }
    }

    let f = f1();
    console.log(f());
    console.log(f());


    // 完全体
    let f = (function(){
        var count = 0;
        return function(){
            return ++count;
        }
    }());
    console.log(f());
    console.log(f());