前端知识点---闭包(javascript)

1.怎么理解闭包?

函数里面包着另一个函数，并且内部函数可以访问外部函数的变量。

<script>
function box() {//周围状态（外部函数中定义的局部变量）let a = 1;// fn 就是封闭的函数function fn() {//封闭函数使用-外部的局部变量a（引用了周围状态）//   console.log(a++);a++;console.log(a);}// 外部函数-返回了内部函数return fn;}//   调用box，就会得到一个函数（就是box内部定义的那个函数fn）let resFn = box();//   resFn 引用box内部的fn，fn引用了局部变量a，导致a在box函数执行完毕以后，所占用的内存，没有被回收掉// 让a常驻内存，像是全局变量一样console.log(resFn);
</script>

外部没法修改count 只能调用fn 相当于count被保护了
不像是全局变量, 任和地方都可以改值 , 如果在别的地方想用count的值 可以在console.log(a);下return a

📌 关键点：

• inner() 是闭包，它能访问 outer() 作用域里的 count。

• 每次调用 fn()，count 的值都会保留，不会重置。

2.闭包的特点

特点	说明
访问外部变量	内部函数能访问外部函数的变量
变量不会消失	外部函数执行完后，变量不会被销毁，因为被内部函数“记住”了
常用于记忆数据	比如计数器、缓存、封装数据等

3.闭包的作用?

封闭数据，实现数据私有，外部也可以访问函数内部的变量

做缓存/记忆功能

在异步代码中保存上下文

4 闭包注意事项：

闭包会占用内存，变量不会被回收，要小心内存泄漏。

不要滥用闭包，大量使用可能影响性能。

5 形象理解

你开了一家面馆：

function 开饭店() {let 秘方 = "老坛酸菜配方"; // 这是私密变量，别人不能直接拿走return function 厨师() {console.log("我记得老板的秘方是：" + 秘方);};
}let 厨师小王 = 开饭店(); // 开店完，返回了一个记得秘方的厨师

🍽️ 每次叫他做菜：

厨师小王(); // 我记得老板的秘方是：老坛酸菜配方
厨师小王(); // 我记得老板的秘方是：老坛酸菜配方

6 闭包的应用

for(var i=0;i<10;i++){setTimeout(() => {console.log(i);}, 1000);}

for(let i=0;i<10;i++){setTimeout(() => {console.log(i);}, 1000);}

let btns=document.querySelectorAll('button')btns.forEach((v,i)=>{v.onclick=()=>{console.log(v,i);}})console.log('111');

循环已经结束了 但还能拿到v跟i的值 说明形成了闭包