如何简单理解闭包

184 阅读2分钟

今天我们就来学一学 “ 闭包 ” !

什么是闭包?

一、理解

通俗一点的讲就是可以在函数外部访问到函数内部的变量。

二、描述

因为正常情况下函数外部是访问不到函数内部作用域变量的,作用域分为全局、函数级、块级作用域。

// 封装函数
function closureFn(){ 
    var a=18;
    // return 嵌套函数
    return function(){ 
        alert(a); // 可以调用外部变量
    }
}
let exeFn = closureFn()  
exeFn() // 调用嵌套函数执行 

三、概念

闭包就是函数作为函数的返回值,延长函数内部变量的生命周期。

四、表象判断是不是闭包

函数嵌套函数,内部函数被return,内部函数调用外层函数的局部变量

五、优点、缺点

1.优点:可以隔离作用域,不会造成全局污染。
2.缺点:由于闭包长期驻留内存,则长期会导致内存泄露

六、如何解决闭包的缺点

将暴露外部的闭包变量置为NULL

七、闭包的使用场景

fetch("地址").then((response) => {
        function dispose() {
          return response.sort();
        }
        let sortResult = dispose();
      });

1.在上面的代码中发送了一个网络请求,我们在其请求成功的函数里面声明了一个函数dispose用于处理请求返回的结果,在dispose我们访问到了不在他这个作用域里面的变量response,这就是一个闭包。
2.函数防抖,函数节流,常用在定时器、事件监听器、 Ajax 请求\

参考原文链接:blog.csdn.net/sxc__/artic…

防抖

防抖:指定时间内 频繁触发一个事件,以最后一次触发为准

// 1.封装防抖函数 
function debounce(fn, time) {
    let timeout = null; 
    return function () { 
        clearTimeout(timeout); 
        timeout = setTimeout(() => {
           fn();
        }, time)
    }
}

节流

节流:指定时间内 频繁触发一个事件,只会触发一次

// 2.封装节流函数 
function throttling(fn, time) {
    let _playing = null
    return function () {
        let _arg = arguments
        if (_playing) {
            return
        }
        _playing = true
        setTimeout(() => {
            fn.apply(this, _arg)
            _playing = false
        }, timeout)
    }
}

“闭包” 学习结束,下一期再见!