闭包与内存泄漏

闭包怎么产生？

当一个嵌套的内部（子）函数引用了嵌套的外部（父）函数的变量（函数）时，就产生了闭包

注：闭包的个数====调用外部函数的次数

闭包是什么？

1，闭包是嵌套的内部函数
2，闭包是包含被引用变量（函数）的对象

注：执行函数定义就会产生闭包（只需要调用外部函数，不用调用内部函数）

<script>
  function fn1(){
    var a = 2;
    function fn2(){ 
        console.log(a)
    }
}
fn1()//已经定义好了fn2，闭包已经产生
</script>

常见的闭包

• 将函数作为另一个函数的返回值

 <script>
 function fn1(){
    var a = 2
    function fn2(){
        a++
        console.log((a))
    }
    return fn2
}
var f = fn1()
f() //3
f() //4
</script>

• 将函数作为实参传递给另一个函数调用

<script>
    function showDelay(mes,time){
        setTimeout(function(){
            alter(msg) // 如果将这句话注释掉，就没有产生闭包，说白了，必须在子函数里调用父函数的变量
        },time)
    }
    showDelay('atguigu',2000)
</script>

闭包的作用

• 使函数内部的变量在函数执行完后，仍然存活在内存中（延长了局部变量的生命周期）
• 让函数外部可以操作（读写）到函数内部的数据（变量/函数）

注：那么问题来了

1，函数执行完后，函数内部声明的局部变量是否还存在？

答：一般是不存在滴，会自动释放。但是！！存在闭包中的变量才可能存在，前提得有引用指向该函数。

2，在函数外部能直接访问函数内部的局部变量吗？

答：不能滴，但是！！可以通过闭包的形式让外部操作内部的变量。

闭包的生命周期

• 闭包的产生：在嵌套内部函数定义执行完就产生了（不是在调用）
• 闭包的死亡：在嵌套的内部函数成为垃圾对象时死亡
  

闭包的应用

自定义JS模块

• JS模块：具有特定功能的JS文件
• 将所有的数据和功能都封装在一个函数内部
• 只向外暴露一个包含n个方法的对象或函数
• 模块的使用者，只需要通过模块暴露的对象调用方法来实现相应功能

自定义JS模块方法一：

function myModule(){
    //私有数据
    var msg = 'My atguigu'
    //操作数据的函数
    function doSomething(){
        console.log('doSomething')
    }
    function doOtherthing(){
        console.log('doOtherthing')
    }
    //向外暴露对象（给外部使用的方法）
    return {
        doSomething:doSomething,
        doOtherthing:doOtherthing
    }
}

<script>
    var module = myModule()
    module.doSomething();
    module.doOtherthing();
</script>

自定义JS模块方法二：

 (function myModule(){
    //私有数据
    var msg = 'My atguigu'
    //操作数据的函数
    function doSomething(){
        console.log('doSomething')
    }
    function doOtherthing(){
        console.log('doOtherthing')
    }
    //向外暴露对象
	window.myModule2 = {
        doSomething:doSomething,
        doOtherthing:doOtherthing
    }
})()

<script>
    myModule2.doSomething();
    myModule2.doOtherthing();
</script>

闭包的缺点

• 函数执行完后，函数内的局部变量没有释放，占用内存时间会变长
• 容易造成内存泄漏（内存被垃圾对象占用）

解决办法：
1，少用闭包
2，及时释放

<script>
    function fn1(){
        var arr = new Array[100000]
        function fn2(){
            console.log(arr.length)
        }
        return fn2
    }
    var f = fn1()
    f()
    f = null;   //让内部函数称为垃圾对象 --> 回收闭包，解决内存泄漏
</script>

内存泄漏

造成内存泄漏的原因：占用的内存没有及时释放
> 内存泄漏会造成什么问题：内存泄漏积累多了就容易导致内存溢出

• 常见的内存泄漏：
  1，意外的局部变量（没有使用var定义变量，直接a=3,导致a成为全局变量）
  2，没有及时清理的计时器或回调函数
  3，闭包

内存溢出

1. 内存溢出是一种程序运行出现的错误，当程序运行需要的内存超过了剩余的内存时，就会抛出内存溢出的错误。
   2.内存泄漏是指没有及时释放占用的内存，内存泄漏积累多了就容易导致内存溢出

<script>
    var obj = {}
    for(var i = 0; i < 10000; i++){
        obj[i] = new Array(10000000)
    }
</script>

面试题

• 题一

<script>
    var name = "The Window";
    var object = {
        name : "My Object",
        getNameFunc: function(){
            return function(){
                return this.name;
            }
        }
    }
    alert(object.getNameFunc()()); // The Window 
    // 一定不能返错误，getNameFunc（）的调用者是object没错
	//调用完后，返回了一个函数，返回函数的this肯定是window啊，所以结果是 The Window 
</script>

• 题二

<script>
    var name2 = "The Window"
    var Object2 = {
        name2 : "My Object",
        getNameFunc: function(){
            var that = this;
            return function(){
                return that.name2;
            }
        }
    };
    alert(Object2.getNameFunc()()); // My Object
	// 调用完后，返回了一个函数，返回函数的this肯定是window,但调用的是that.name2
	// var that = this，表示在调用getNameFunc（）函数的时候，将that保存为getNameFunc（）的this了
	//由Object调用的getNameFunc()，因此函数内this为Object，则that也为Object，输出为My Object
</script>

• 题三