什么是闭包?

闭包(closure):闭包是一种代码形式,内部函数访问外部函数的局部变量

JS中,每当创建一个函数,闭包就会在函数被创建时被同时创造出来,作为函数内部与外部连接起来的一座桥梁

举例:js函数A里面有一个函数B,函数B访问函数A里面定义的局部变量,此时就产生了闭包

变量所在的函数就是闭包函数,这里A就是闭包函数

我们上代码来看看

//外部函数
        function outer(){

             //外部函数的局部变量
            let n =10;

            //内部函数
            function inner(){
                //内部函数访问外部函数的局部变量
                console.log(n);
            }
           
            //将内部函数return出去,只有外部才可以调用
             return inner
        }
        let fn = outer();
        console.log(fn);
        fn()

jquery闭包函数的变量_局部变量

闭包的作用 

闭包的作用1

作用1:解决变量污染问题,让变量被函数保护起来

实例代码:

let count =0
        setInterval(function(){
            console.log(count++);
        },1000)

以上代码的count是一个使用频率很高的变量

为了避免和其他位置的代码冲突,可以再使用一个函数把以上的代码包裹起来,起到保护作用

function fn(){
            let count =0
            setInterval(function(){
                console.log(count++);
            },1000)
        }
 

      fn()

       以上代码中,setInterval函数与count构成了闭包

function fn(){
             let count =0

             function add(){
                 console.log(count++);
             }
             setInterval(add,1000)

         }
         fn()

以上代码中,add+count构成了闭包

总结:一个函数内使用了外部的变量,那这个函数和被使用的外部变量一起被称为闭包结构

在实际开发中,通常会再使用一个函数包裹住闭包结构,以起到对变量保护的作用

闭包的作用2:

作用2:可以延长变量的生命周期

关于这点我们先来说一下变量的生命周期:

全局变量:从声明开始 直到 页面关闭

局部变量:从声明开始 直到 函数执行结束

全局变量

let n = 10;
function ck(){
console.log(n);
}
// 函数内部可以访问到全局变量
 ck()//10

局部变量

function outer(){
 // 局部变量:特点1-只能在函数内部访问 
 // 特点2-函数执行结束后就会被销毁 
 let b = 20; 
// // 内部访问局部变量v 
 console.log(b); //20 
 };

 outer();
// 函数作用域外,访问局部变量x
 console.log(b);

将上述情况变成闭包函数,定义一个内部函数,让其访问到外部函数的局部变量

function outer (){
    let b = 20;
return function inner(){
console.log(b);
}
}
let fun = outer()
fun()

取消注释,打印45行结果 访问到42行打印的b

闭包的作用3

作用3:提供了有限的访问权限

function data(){
            let age =18
            
            //读取数值
            function getAge(){
                // return age
            }
            function setAge(n){
                //在赋值时,所赋的值进行合理的校验
                if(n>0&& n<100){
                    age=n
                }
            }
            //返回一个对象到外部,对象带着两个内部函数
            return{
                getAge:getAge,
                setAge:setAge
            }
        }
        let op =data();
        op.setAge()
        console.log(op.getAge());