闭包详解

什么是闭包(Closures)

根据MDN上的文档:一个函数和对其周围状态(lexical environment,词法环境)的引用捆绑再一起(或者说函数被引用包围),这样的组合就叫做闭包(closures)。也就是说闭包可以让你在一个内层函数中访问到其他外层函数的作用域。在JavaScript中,每当创建一个函数,闭包就会在函数创建同事被创造出来。

看一个三行代码的简单例子:

当上面的代码运行在一个即刻执行中函数中时,这三行代码有局部变量a,有函数fo,函数fo引用了a变量

这个就是一个闭包。

[函数]和[函数内部能够访问到的局部变量](环境)的总和,就是闭包

上面是极简的闭包,正常的闭包一般会类似于下面这种

function f1(){
let n=233;
   function f2(){
       alert(n)
  };
   return f2;
}
let result=f1();
result();//233

这段代码中变量n和函数f2组成了一个闭包。

闭包的作用

1、闭包常用于间接访问一个变量隐藏一个变量

JS中的全局变量很容易遭到污染,使用闭包可以避免

2、可以读取函数内部的变量

闭包的缺点

使用闭包不当有可能会导致以下问题

1、变量不会被垃圾回收机制回收,消耗内存

2、在IE浏览器中可能会造成内存泄露的问题

闭包应用

需求:实现变量a自增

1、通过全局变量实现

let a = 233;

function Add(){

• a++;

• console.log(a);

}
Add();
Add();
Add();

结果

但是这样容易污染其他程序

2、定义一个局部变量

let a = 233;
function Add2(){
let a = 233;
a++;
console.log(a);
}
Add2();
Add2();
Add2();
console.log(a)

这样虽然不会污染全局但是会导致无法自增

3、使用闭包

let a=233
function Add3(){
  let a=233
  return function (){
  a++
  return a
  };
};
let demo=Add3()
demo();
demo();
demo();
console.log(a)

这样就可以通过函数内部的局部变量实现递增,又不会影响全部变量

前端

DOM事件模型

2021-1-10 19:50:57

前端

call、apply、bind的用法分别是什么?

2021-2-28 14:59:58

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
今日签到
有新私信 私信列表
搜索