闭包的理解和应用场景

理解：
闭包就是一个函数包裹着另一个函数，同时内部函数可以调用外部函数的变量。这就是一个简单的闭包。

闭包本质上就是当前函数内有着可以指向外部函数（父级作用域）的引用

闭包的使用，可以让我们在函数外部可以访问内部函数的变量，通过闭包调用闭包函数，从而创建私有变量。
闭包的使用，可以让运行完的变量对象存储在内存中，因为闭包函数保留了这个变量对象的引用，所以这个变量对象不会被垃圾回收站回收。

内存泄漏：
闭包也会造成内存的泄露，原因是因为运行完的变量对象会缓存到内存中，并不会被回收，占用内存，导致内存过多造成内存泄漏。

如何解决闭包的内存泄漏：
（1）在变量不被使用时，我们可以手动对变量赋值为null
（2）避免变量的循环赋值和引用。

闭包的应用场景：

1. 柯里化函数：
   为了避免频繁调用同一个函数的参数，可以将一个多参数的函数转化为一个单参数的函数。

//普通函数
function getArea(w,h){
    return w * h;
}
const area1 = getArea(10,20);
const area2 = getArea(10,30);


//柯里化函数
function getArea(w){
    return function(h){
        return w * h;
    }
}
const getTenArea = getArea(10);

const area1 = getTenArea(20);
const area2 = getTenArea(30);

2. 私有化变量：

function funOne(i){
    function getTwo(){
        console.log('参数：', i)
    }
    return getTwo;
}
const fa = funOne(100); 

3. 防抖节流：

（1）防抖:当持续触发某种事件时，一定时间没有执行该事件，处理函数才会调用。
（2）节流：当持续触发某种事件时，在一定时间范围内，限定执行处理函数的次数。

// 防抖
const debounce = (fn, wait)=> {    
    let timeout;    
    return ()=> {        
        // 每当用户触发事件的时候把前一个 setTimeout clear 掉
        clearTimeout(timeout);        
        // 然后又创建一个新的 setTimeout, 这样就能保证wait 间隔内如果时间持续触发，就不会执行 fn 函数
        timeout = setTimeout(()=>{fn()}, wait);    
    }
}
// 处理函数
const handle = ()=> {    
    console.log(`防抖:${Math.random()}`); 
}
// 滚动事件
window.addEventListener('scroll', debounce(handle, 1000));

// 节流throttle代码（定时器）：
function throttle(fn, wait) {            
    let timer = null;            
    return function() {       
        if (timer)return;                
        timer = setTimeout(()=> {                        
            fn()                     
            timer = null;                    
        }, wait);    
    }        
}        
function handle() {            
    console.log(`节流:${Math.random()}`);        
}        
window.addEventListener('scroll', throttle(handle, 3000));