带你读《现代Javascript高级教程》二、执行上下文与闭包(1)

简介: 带你读《现代Javascript高级教程》二、执行上下文与闭包(1)

二、执行上下文与闭包

1. 由来

JavaScript中的闭包源于计算机科学中的一种理论概念,称为“λ演算”(Lambda Calculus)。λ演算是计算机科学的基础之一,1930年由Alonzo Church提出,它是一种用于描述计算过程的数学抽象模型,也是函数式编程语言的基础。

 

在JavaScript中,闭包是函数和声明该函数的词法环境的组合。这个环境包含了闭包创建时所能访问的所有局部变量。

 

理解闭包,需要理解JavaScript的特性和工作原理。JavaScript的函数在创建时,就确定了其操作的上下文环境,即词法作用域。这是因为JavaScript采用的是静态作用域,也叫词法作用域,函数的作用域在函数定义的时候就决定了。

 

例如:

function outer() {
    var name = 'JavaScript';
    function inner() {
        console.log(name);
    }
    return inner;}
var innerFunc = outer();innerFunc(); // 输出 'JavaScript'

 

在这个例子中,outer函数返回了inner函数。inner函数访问了outer函数的局部变量name,因此形成了一个闭包。即使outer函数执行完毕,name变量的引用仍然被保留,因此innerFunc在执行时仍然能够输出 'JavaScript'。

 

闭包的概念虽然来自计算机科学的深层理论,但在日常的JavaScript编程中,它是一个非常实用且常见的特性,被广泛用于如数据隐藏和封装、模块化编程、回调函数和计时器等许多场景中。


2.JavaScript中的闭包


在JavaScript中,闭包是一个强大而复杂的特性,理解和利用好闭包对于编写高效且安全的代码至关重要。下面就让我们深入地了解一下JavaScript的闭包。

闭包是指那些能够访问自由变量的函数。什么是自由变量呢?如果一个变量在函数内部被引用,但它既不是函数的参数也不是函数的局部变量,那么就称之为“自由变量”。

 

例如,我们有一个外部函数和一个内部函数:

 

function outerFunction(outerVariable) {
  function innerFunction() {
    console.log(outerVariable);
  }
  return innerFunction;}
var inner = outerFunction('Hello Closure');inner(); // 输出 'Hello Closure'

 

在这个例子中,outerFunction是一个外部函数,接受一个参数outerVariable。它包含一个内部函数innerFunction,这个内部函数没有自己的参数或局部变量,但却引用了外部函数的变量outerVariable。所以,我们说innerFunction是一个闭包,而outerVariable就是它的自由变量。

 

需要注意的是,由于JavaScript的垃圾回收机制,如果一个变量离开了它的作用域,那么这个变量就会被回收。但是,由于innerFunction是一个闭包,它引用了outerVariable,所以即使outerFunction执行完毕,outerVariable离开了它的作用域,但仍然不会被垃圾回收机制回收。

 

再者,每次调用外部函数,都会为内部的闭包创建一个新的作用域。例如:

 

var inner1 = outerFunction('Hello Closure 1');
var inner2 = outerFunction('Hello Closure 2');
inner1(); // 输出 'Hello Closure 1'
inner2(); // 输出 'Hello Closure 2'

 

这里,inner1inner2是两个不同的闭包。他们分别有自己的作用域,储存了不同的outerVariable


带你读《现代Javascript高级教程》二、执行上下文与闭包(2)https://developer.aliyun.com/article/1349707?groupCode=tech_library

相关文章
|
1月前
|
JavaScript 前端开发
JavaScript 闭包:让你更深入了解函数和作用域
JavaScript 闭包:让你更深入了解函数和作用域
|
8天前
|
前端开发 JavaScript 安全
高级前端开发需要知道的 25 个 JavaScript 单行代码
1. 不使用临时变量来交换变量的值 2. 对象解构,让数据访问更便捷 3. 浅克隆对象 4. 合并对象 5. 清理数组 6. 将 NodeList 转换为数组 7. 检查数组是否满足指定条件 8. 将文本复制到剪贴板 9. 删除数组重复项 10. 取两个数组的交集 11. 求数组元素的总和 12. 根据指定条件判断,是否给对象的属性赋值 13. 使用变量作为对象的键 14. 离线状态检查器 15. 离开页面弹出确认对话框 16. 对象数组,根据对象的某个key求对应值的总和 17. 将 url 问号后面的查询字符串转为对象 18. 将秒数转换为时间格式的字符串 19.
18 3
高级前端开发需要知道的 25 个 JavaScript 单行代码
|
1天前
|
自然语言处理 JavaScript 前端开发
JavaScript闭包是函数访问外部作用域变量的能力体现,它用于封装私有变量、持久化状态、避免全局污染和处理异步操作。
【6月更文挑战第25天】JavaScript闭包是函数访问外部作用域变量的能力体现,它用于封装私有变量、持久化状态、避免全局污染和处理异步操作。闭包基于作用域链和垃圾回收机制,允许函数记住其定义时的环境。例如,`createCounter`函数返回的内部函数能访问并更新`count`,每次调用`counter()`计数器递增,展示了闭包维持状态的特性。
15 5
|
8天前
|
设计模式 自然语言处理 JavaScript
JavaScript进阶-函数表达式与闭包
【6月更文挑战第18天】JavaScript函数不仅是代码块,还是值,具备函数表达式和闭包等特性。函数表达式如匿名函数,可赋值、传参,但不提升,过度使用影响可读性。闭包允许访问外部作用域,即使父函数已结束,但不当使用可能导致内存泄漏。理解并妥善处理这些问题,如命名函数表达式、及时释放引用,能提升代码质量。通过实践深化对这些关键概念的理解至关重要。
|
20小时前
|
前端开发 JavaScript 安全
解锁 JavaScript ES6:函数与对象的高级扩展功能
解锁 JavaScript ES6:函数与对象的高级扩展功能
|
21小时前
|
存储 JSON JavaScript
JavaScript 魔法镜:透视对象Object与执行上下文的内在奥秘
JavaScript 魔法镜:透视对象Object与执行上下文的内在奥秘
|
1天前
|
弹性计算 自然语言处理 JavaScript
彻底明白js的作用域、执行上下文
彻底明白js的作用域、执行上下文
|
8天前
|
缓存 前端开发 JavaScript
【JavaScript】JavaScript 中的闭包:从入门到精通
【JavaScript】JavaScript 中的闭包:从入门到精通
12 0
|
1月前
|
JavaScript 前端开发
web前端JS高阶面试题(1),高级开发工程师面试
web前端JS高阶面试题(1),高级开发工程师面试
|
20天前
|
Web App开发 资源调度 JavaScript
【保姆级】前端使用node.js基础教程
【6月更文挑战第3天】Node.js 是基于 Chrome V8 引擎的 JavaScript 运行环境,用于服务器端编程。常用命令包括:安装 Node.js,通过 `node -v` 查看版本;使用 npm(Node 包管理器)进行初始化、安装/卸载包、查看版本和更新;运行 `.js` 脚本;使用 `node inspect` 调试;借助 nodemon 实现自动重启;通过 `npm list` 管理包;
9 0