闭包回顾1

js垃圾回收机制

• Garbage Collection：执行环境负责管理代码执行过程中使用的内存。
• 内存泄漏：当已经不需要某块内存时这块内存还存在着，没有被释放，导致该内存无法被使用。
• 垃圾回收机制就是间歇的不定期的寻找到不再使用的变量，并释放掉它们所指向的内存，以防内存泄漏。
• 闭包（closure）：函数内部返回一个函数，这个函数被外界所引用，内部函数就不会被js回收机制所销毁，内部函数所用到的外部函数的变量也不会被销毁。

function outer() {
     let name = 'james'
     let age = 37
     return function() {
         return name + ' is a superstar.';
     }
 }
 let func = outer()
 console.log(func()); //james is a superstar.

在上方代码中我们定义了一个外部函数outer(),在外部函数内部返回了一个函数(内部函数),随后在外界中将外部函数赋给了func,这个func就是内部函数，然后执行func(),打印出来了相应的结果，在这里，我们使用了外部函数内定义的属性name和内部函数,所以name和内部函数不会被js回收机制所处理，但是属性age我们并没有使用，所以age被js垃圾回收机制所回收！

• 在代码解析中，我们知道了我们所创建的临时变量name将不会被回收，所以闭包的优点就是：让临时变量可以永驻内存。
• 但是如果我们不停地执行func，那么就会出现问题，这样的话会使内存中不断的储存临时变量，就会导致内存泄漏。
• 项目场景：防抖和节流。

<input type="text" id="search">

闭包防抖（Debounce）

防抖就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。

• 举个例子吧：
  例如，你是一个肯德基外卖配送员，每天专门配送去学校的外卖（不考虑配送时间）。
  如果每次只配送一单，肯定很划不来。
  你接到一个配送订单，心里想在等3分钟，如果3分钟没有配送订单我就配送
  如果又有一个配送订单，你就会想再等3分钟，
  直到3分钟没有什么外卖订单，就开始配送

//接一个订单，和等待时间
function debounce(fn, delay){
     let timerId = null
     return function(){
         const context = this
         //如果接到订单就再等3分钟
         if(timerId){window.clearTimeout(timerId)}
         //3分钟没有接到订单就直接配送
         timerId = setTimeout(()=>{
             fn.apply(context, arguments)
             timerId = null
         },delay)
     }
 }

闭包节流（Throttle）

节流就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率

• 举个例子吧：
  例如你在打王者荣耀，你的技能在3秒能触发一次
  触发一次后，3秒能将不能被触发。

function throttle(fn, delay){
     // 设置一个触发开关
     let canUse = true
     return function(){
     //如果为true，就触发技能，否则就不能触发
         if(canUse){
             fn.apply(this, arguments)
             //触发技能后，关闭开关
             canUse = false
             //在3秒后打开开关
             setTimeout(()=>canUse = true, delay)
         }
     }
 }

参考：
https://blog.csdn.net/Nicole99618/article/details/115287927
https://blog.csdn.net/m0_52040370/article/details/127131663