I am poor and inexperienced.

【JS】JS基础知识之(闭包)


avatar
Lucky 2024-12-08 284

前言:本文主要想让你快速明白,什么是闭包!

什么是闭包?

答:简单通俗易懂来说:函数嵌套着函数,【里面函数】调用了【外部函数】的变量,这就是闭包!上代码展示

function aaa() { // aaa函数嵌套bbb函数
            let count = 0 //aaa函数里面的变量count
            function bbb() {
                count++ //bbb函数调用了aaa函数的变量count,这就形成了闭包
                console.log(count)
            }
        }

经过上面简单的案例,相信你一下子就明白了什么是闭包了吧!

“官方”的解释是:所谓“闭包”,指的是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。

闭包有什么作用?

答:解决变量污染问题;变量封装与隐藏;延长局部变量的生命周期等;

// 第一种写法
function aaa() {
    let count = 0 //变量count在函数内部,aaa函数外部是调用不了的。
    function bbb() {
        count++ //bbb函数可以调用外部函数count,形成了闭包
        console.log(count) //这里打印这个值看看是否调用成功!
    }
    return bbb //把这个bbb函数return出去
}
// console.log(count) 例如我这里想调用count变量,是调用不了,提示变量不存在。
const ccc = aaa() //aaa中返回的是bbb函数,所以是将bbb函数赋值给ccc
ccc()  // 1
ccc()  // 2
ccc()  // 3
//执行完函数发现打印数值增加。
//因此说明了,count这个变量变成了局部私有的了,隐藏起来了;他的生命周期得到延长;只能通过该函数才能调用到该变量,在全局中是调用不到的。

// 第二种写法
function aaa() {
    let count = 0
    return function bbb() {
        count++
        console.log(count)
    }
}
const ccc = aaa()
ccc()  // 1
ccc()  // 2
ccc()  // 3
// 以上两个写法看懂一个即可,其实都一样的,都是标识把bbb这个函数return出去赋值给ccc

实用场景:防抖节流,函数柯里化,模块化编程。这个需要你们自己去探索了。

 

闭包的优缺点:

优点:数据隐私和封装性好,增强函数的灵活性和复用性,延续变量生命周期。

缺点:内存泄漏风险,性能开销,代码可读性降低。

多看多学,不断探索,总有一次你会理解,本文只是想让你快速知道什么是闭包,如果需要更深层次,去知识的海洋探索吧。