JavaScript闭包

我们从一个新的函数开始,一个安全预订的函数;

javascript 复制代码
const secureBooking = function () {
  let passengerCount = 0;

  return function () {
    passengerCount++;
    console.log(`${passengerCount} passengers`);
  };
};

const booker = secureBooking();

下面我们将使用一个图片来看一下booker函数是如何被创建的

● 现在我们直接将booker函数调用

● 我们可以看到,乘客的数量被累加了,但是这是为什么呢?booker函数是如何记住上一次是多少顾客的呢?

这是因为 JavaScript 中的闭包(closure)的原理。在这个例子中,secureBooking 函数返回了一个内部函数,而这个内部函数引用了 secureBooking 函数作用域中的 passengerCount 变量。由于内部函数保留对外部函数作用域的引用,所以每次调用 booker 函数时,passengerCount 变量都会被更新并保留在内存中,这样就实现了记住乘客人数的累计功能。

注:

● 函数可以访问创建它的执行上下文的变量环境(VE)

● 闭包:VE附加到函数,与函数创建的时间和地点完全一致

当我们调用 secureBooking() 函数时,它会返回一个内部函数,并且这个内部函数可以访问到 secureBooking() 函数作用域中的变量。在这个例子中,passengerCount 变量就是定义在 secureBooking() 函数内部的一个变量。但由于内部函数保持了对外部函数作用域的引用,所以每次我们调用 booker() 函数时,它都可以访问并修改 passengerCount 变量的值。

换句话说,闭包是指内部函数可以记住并访问到其外部函数作用域中的变量,即使在外部函数执行完毕后仍然能够使用这些变量。因此,通过闭包,我们可以创建一种在函数外部无法直接访问的"私有"状态,比如这里的乘客人数累计,而且内部函数可以根据这个"私有"状态执行一些操作。

闭包总结

● 闭包是在其中创建函数的执行上下文的封闭变量环境,即使在该执行上下文消失之后;

● 更加通俗的说,闭包允许函数访问父函数的所有变量,即使在父函数返回后也是如此。该函数保留对其外部作用域的引用,从而在整个时间内保留作用域链。

● 闭包确保函数不会与函数诞生时存在的变量断开连接;例如,你和你的家,你就相当于一个功能,这个功能不会因为你离开了家就会与你的家断开联系,即使你离开了(函数被返回了),你仍然和你的家有关联;

● 在类比一下,一个闭包就像一个背包,一个功能随身携带,无论它走到哪里。这个背包包含创建函数的环境中存在的所有变量;

注:我们不需要手动创建闭包,这是一个JavaScript特性,它会自动发生。我们甚至不能明确地访问封闭变量。闭包不是有形的JavaScript对象。

相关推荐
t***5443 小时前
如何配置Orwell Dev-C++使用Clang
开发语言·c++
CoderCodingNo3 小时前
【信奥业余科普】C++ 的奇妙之旅 | 13:为什么 0.1+0.2≠0.3?——解密“爆int”溢出与浮点数精度的底层原理
开发语言·c++
kongba0075 小时前
项目打包 Python Flask 项目发布与打包专家 提示词V1.0
开发语言·python·flask
froginwe115 小时前
C 语言测验
开发语言
今夕资源网5 小时前
powershell工具包 安装升级脚本并设置UTF-8 环境快捷方式创建 将powershell的编码默认改为UTF-8
开发语言·utf-8·powershell·utf-8编码·powershell7·powershell5·设置utf-8编码
机器视觉知识推荐、就业指导6 小时前
Qt:真正的门槛不是入门,而是维护
开发语言·qt
hhb_6186 小时前
Dylan 语言核心特性与工程实践深度解析
开发语言·c#
无巧不成书02186 小时前
零基础Java网络编程全解:从核心概念到Socket实战,一文打通Java网络通信
java·开发语言·网络
MXN_小南学前端6 小时前
watch详解:与computed 对比以及 Vue2 / Vue3 区别
前端·javascript·vue.js
饭小猿人6 小时前
Flutter实现底部动画弹窗有两种方式
开发语言·前端·flutter