node(闭包)

                                         什么是闭包

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

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

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

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

<script>
        
      // 外部函数
function outer(){
// 外部函数中的局部变量
let n =10
// 内部函工
function inner(){
//内部函数访问外部函数的局部变量 
console.log(n);
}
//将内部函数return出去,这样外部才可以调用 
return inner
}
let fn =outer();

console.log(fn);

fu()
    </script>

                                               闭包作用

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

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

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

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

 <script>
        
       // 示例代码 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()

    </script>

                                                    2

 

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

变量的声明周期:

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

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

【全局变量】

 全局变量n 写在函数外面

【局部变量】

 局部变量:特点1-只能在函数内部访问

 特点2-函数执行结束后就会被销毁    

<script>

 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
    </script>

                                                         3

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

 <script>
       
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(80)
console.log(op.getAge());
    </script>

猜你喜欢

转载自blog.csdn.net/m0_73495603/article/details/127323836