讲师中心 微信公众号
AI工具推荐 视频效率加速

什么是作用域_JavaScript中的作用域链如何工作

陌丽君_6683

陌丽君_6683

发布时间:2026-01-05 20:53:28

|

345人浏览过

|

来源于php中文网

原创

词法作用域指函数作用域在定义时即确定,由静态嵌套的词法环境链决定;作用域链是引擎沿[[Environment]]逐层向上查找变量的路径,闭包、var/let/const行为及模块作用域均受其约束。

什么是作用域_javascript中的作用域链如何工作

JavaScript 中的作用域不是“变量能不能被看到”的模糊概念,而是由函数定义时所处的词法环境决定的一套**静态可追溯的嵌套关系**;作用域链就是引擎沿着这条关系逐层向上查找变量的实际路径。

什么是词法作用域(Lexical Scope)

JavaScript 采用词法作用域,意味着函数的作用域在**函数定义时就确定了**,跟它在哪里被调用无关。这和“动态作用域”(比如某些 shell 或 Lisp 变体)完全不同。

常见错误现象:ReferenceError: x is not defined 或意外读到外层同名变量,往往是因为误以为调用位置决定了作用域。

  • 函数内部访问变量,先查自己 [[Environment]](即闭包环境),再查外层函数的 [[Environment]],直到全局
  • eval() 和 with 会动态修改词法作用域,但已被严格模式禁用,不建议使用
  • 箭头函数没有自己的 this 和 arguments,但它继承外层函数的词法作用域(包括 [[Environment]])

作用域链怎么构建:从函数创建说起

每次声明函数(无论 function、=> 还是 class 方法),JS 引擎都会为它绑定一个隐藏属性 [[Environment]],指向其定义时所在词法环境的记录(Lexical Environment Record)。

OpenJDK 24
OpenJDK 24

OpenJDK 24 Windows x64 官方参考实现(24+36),适合 Windows 环境进行 Java 开发、编译、运行和版本兼容性验证。

下载

立即学习“Java免费学习笔记(深入)”;

这个链不是运行时临时拼的,而是在函数对象创建那一刻就固化下来的。

  • 全局代码的 [[Environment]] 指向全局环境(含 window / globalThis 等)
  • 函数 A 内定义函数 B,则 B 的 [[Environment]] 指向 A 创建时的词法环境(哪怕 A 已执行完毕)
  • 每个词法环境包含两个部分:EnvironmentRecord(存变量)和 outer(指向上一级环境)
function outer() {
  const x = 'outer';
  function inner() {
    console.log(x); // x 在 outer 的 EnvironmentRecord 中
  }
  return inner;
}
const fn = outer();
fn(); // 输出 'outer' —— inner 的 [[Environment]] 仍指向 outer 执行时留下的环境

var / let / const 对作用域链的影响

三者都受词法作用域约束,但声明提升(hoisting)和暂时性死区(TDZ)会让它们在作用域链中“可见性”不同。

  • var 声明会被提升到函数或全局顶部,初始化为 undefined;它在整块作用域内都存在于当前环境记录中
  • let 和 const 也会被提升,但未初始化,从声明前到初始化前处于 TDZ;引擎在查找时若遇到 TDZ 中的变量,直接抛 ReferenceError
  • 块级作用域({})对 let/const 有效,但对 var 无效;这意味着 if 或 for 块不会产生新的作用域链节点

容易被忽略的关键点

作用域链只用于**标识符解析(Identifier Resolution)**,和 this 绑定、原型链、模块导入导出完全无关。很多人混淆“找不到变量”和“this 指向不对”,其实是两条独立机制。

  • 闭包捕获的是整个词法环境,不是单个变量值;多个闭包共享同一份 [[Environment]],改一个会影响另一个(比如循环中没用 let 声明 i)
  • 使用 debugger 或 DevTools 的 “Scope” 面板,能看到当前执行位置的完整作用域链,比猜更可靠
  • ES6 模块(import/export)有独立的模块作用域,它也参与作用域链,但模块顶层不是全局,也不污染全局

热门AI工具

更多
UpDream
UpDream Hot

一款AI视频创作工具,主要用于哔哩哔哩推出的自研AI视频创作工具,适合需要提升相关任务效率的用户。

UP简历
UP简历 Hot

一款AI办公效率工具,主要用于基于AI技术的免费在线简历制作工具,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

二狗PPT
二狗PPT Hot

一款AI演示文稿工具,主要用于专为中式职场打造的AI PPT生成工具,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

Laper
Laper Hot

Laper是专为编剧、导演和制片人推出的 AI 原生剧本创作工具。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

Seko
Seko Hot

一款AI视频创作工具,主要用于商汤科技推出的创编一体的AI短视频创作Agent,适合需要提升相关任务效率的用户。

AionClaw
AionClaw Hot

AionClaw是一款面向办公、创作和编程任务的AI桌面智能体。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

285

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

406

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

375

2025.12.24

mysql标识符无效错误怎么解决
mysql标识符无效错误怎么解决

mysql标识符无效错误的解决办法:1、检查标识符是否被其他表或数据库使用;2、检查标识符是否包含特殊字符;3、使用引号包裹标识符;4、使用反引号包裹标识符;5、检查MySQL的配置文件等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

14040

2023.12.04

Python标识符有哪些
Python标识符有哪些

Python标识符有变量标识符、函数标识符、类标识符、模块标识符、下划线开头的标识符、双下划线开头、双下划线结尾的标识符、整型标识符、浮点型标识符等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1083

2024.02.23

java标识符合集
java标识符合集

本专题整合了java标识符相关内容,想了解更多详细内容,请阅读下面的文章。

7970

2025.06.11

c++标识符介绍
c++标识符介绍

本专题整合了c++标识符相关内容,阅读专题下面的文章了解更多详细内容。

3162

2025.08.07

c语言const用法
c语言const用法

const是关键字,可以用于声明常量、函数参数中的const修饰符、const修饰函数返回值、const修饰指针。详细介绍:1、声明常量,const关键字可用于声明常量,常量的值在程序运行期间不可修改,常量可以是基本数据类型,如整数、浮点数、字符等,也可是自定义的数据类型;2、函数参数中的const修饰符,const关键字可用于函数的参数中,表示该参数在函数内部不可修改等等。

2138

2023.09.20

OpenJDK JVM参数怎么调优
OpenJDK JVM参数怎么调优

Java应用运行缓慢,如何调整JVM参数?本专题介绍OpenJDK JVM性能调优的基本流程,涵盖性能指标确认、运行数据采集、内存配置和垃圾回收分析,帮助你先定位瓶颈,再通过对照测试验证效果,避免直接套用参数而影响应用稳定性。

0

2026.10.16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
WebStorm 官方调试文档
WebStorm 官方调试文档

共0课时 | 0人学习

React 教程
React 教程

共58课时 | 12.2万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 6.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn