js 闭包介绍

最新推荐文章于 2024-10-09 11:19:11 发布

悠悠然的心态

最新推荐文章于 2024-10-09 11:19:11 发布

阅读量222

点赞数 8

分类专栏： JavaScript 文章标签： javascript 前端

本文链接：https://blog.csdn.net/zhujiale159/article/details/134816924

版权

JavaScript 专栏收录该内容

24 篇文章 0 订阅

订阅专栏

本文详细解释了闭包的概念，涉及其工作原理（静态作用域和作用域链），以及闭包在函数中的作用（数据保留和避免全局污染）。同时讨论了闭包可能导致的内存泄漏问题及如何避免。通过实例对比展示了闭包与非闭包的区别。

摘要由CSDN通过智能技术生成

闭包的概念

闭包指的是一个空间 / 环境，内部函数访问外部函数的变量时就会产生闭包

function fn(){
	let num = 10
    function inner(){
        console.log(num)
    }
    inner()
}
fn()
// inner内部函数访问了fn外部函数的变量，因此fn中形成闭包

闭包的原理

首先要明白两个规则：

1、静态作用域：函数本身所处的作用域，取决于函数定义的位置，和函数调用的位置无关

2、作用域链：访问一个变量，先在自身作用域查找，如果自身没有，就会到上级作用域查找

在fn中定义inner时，根据规则1，inner的作用域为fn

在inner调用num时，根据规则2，会找到fn中的num

此时将内部函数返回，就可以在外面访问函数内部的变量，这也是闭包最常用的用法

function fn(){
	let num = 10
    function inner(){
        return num
    }
    return inner
}
// res就是inner函数
const res = fn()
console.log(res())    // 打印10

闭包的作用

1、让函数外部访问函数内部的变量
3、在函数内声明变量，避免全局污染
2、让函数内的变量，常驻内存（数据始终保存在内存中，不会被销毁）

闭包的缺点

导致变量不会被垃圾回收机制回收，可能会造成内存泄漏

内存泄漏：不再使用的一块内存，因某种原因无法释放

闭包的使用

// 没有闭包
// 每次调用函数，打印的值都是2
// 因为num在每次函数执行完毕后，num都被垃圾回收机制回收了
function fn1(){
	let num = 1;
    console.log(++num);
}
fn1();    // 2
fn2();    // 2

// 使用闭包
// 每调用一次函数，数字增加1
// 因为闭包中的变量不会被回收
function fn2(){
	let num = 1;
    function inner(){
        console.log(++num);
    }
    return inner;
}
const res = fn2();
res();    // 2
res();    // 3