js闭包问题

下面谈谈我对闭包的学习 总结一些自己的理解

一. 怎么样才算是闭包 或者说 什么是闭包

答：最浅显的也是最容易的懂的回答就是 函数里调用函数

function outer(){
            let a1 = 111;
            let a2 = 222;
            return function inner(){
                return a1;
            }
        }

以上举例一个最简单闭包写法

a1就是 我们内部函数返回的a1

读到这里如果还不明白的话 请往下看

二.为什么要用闭包 或者说 闭包有什么作用

继上文可以看到

在内存中，我们通过闭包为a1生成了内存空间 如果不使用闭包的话呢

function other(){
            let a3 = 333;
        }

打印一下

我们都知道  let在函数内定义的变量在调用函数会被垃圾回收机制回收

下面放一下两个的代码对比  有需要可以运行一下

function outer(){
            let a1 = 111;
            let a2 = 222;
            return function inner(){
                return a1;
            }
        }

        function other(){
            let a3 = 333;
        }


        function fn(){
            let getData = outer();
            console.dir(getData);
        }
        fn()

        function fn1(){
            let geta3 = other()
            console.dir(geta3);
        }
        fn1()

所以第二个问题的答案就是  闭包可以为变量生成内存空间延长变量的生命周期，但是此变量只能在调用该函数时使用，其他函数不可访问此变量

除此之外闭包存在的意义还有一个

闭包可以创建私有环境   下面我来给大家解释一下

先上代码

function result(){
            let number= 0;
            function change(value){
                number += value
            }
            return {
                add(){
                    change(1)
                },
                reduce(){
                    change(-1)
                },
                value(){
                    return number
                }
            }

        }
        //这里用两个结果举例对比一下
        let res1 = result()
        let res2 = result()

        res1.add()
        res2.add()
        res2.add()

        console.log(res1.value());
        console.log(res2.value());

这里是我写的一个小例子

由上文解释可以看出这属于一个闭包

 由打印的结果可以看出  res1，res2两个分别有自己的私有环境  进行增加互不干扰

看到这里可能有同学会联想到一个问题

vue里面的data为什么是一个函数而不是一个对象

data(){
        return {
             foo:"foo"
        }
    }

这是们常见的写法  大概可以看出  这也是运用了闭包吧

答案 是

由于vue属于单页面多组件的开发模式

如果运用了对象的写法  那么会导致多组件共享数据  那么不就乱套了

所以这里也是运用到了闭包的创建私有环境的功能了

以上仅是个人理解  如果我的理解有问题请大家留言或者私信我  以免社死  谢谢