JavaScript词法作用域
source link: https://blog.csdn.net/qq_44983621/article/details/112640482
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
JavaScript词法作用域
词法作用域是什么？
js词法作用域是什么？ 个人理解：它是一种规则，规定了我们的js程序按照特定方式去查找变量。词法作用域又叫静态作用域，函数的作用域在函数定义的时候就规定了。这个规则其实粗俗的理解就是就近原则，通过下方试验可得出。
// 示例一
var value = 1;
function foo() {
console.log(value);
}
function bar() {
var value = 2;
foo();
}
bar(); // 1
这个结果输出是1 ，根据我们的词法作用域，我们的foo函数在定义阶段其实是跟bar函数没有关系的这只是两个函数，不关心函数内部。因此上面的代码也可以理解成下面 示例二：
// 示例二
var value = 1;
function foo() {
console.log(value);
}
bar(); // 1
在你写完第四行的时候作用域就决定了，value会先找同一级的，然后发现没有就会找上一级的，结果输出就为1。接下来变化一种形式如下：
// 示例三
function foo() {
console.log(value);
}
function bar() {
var value = 2;
foo();
}
bar();
这次这个会输出什么呢？根据上面的结论我们不难得出应该输出undefined，我们可以参考示例二来推出我们这个结果。函数定义阶段决定了我们js查找变量的方式，而不是调用阶段
示例（难度加深）
接下来升级一下难度，看如下的代码：
// 示例四
var scope = "global scope";
function checkscope() {
var scope = "local scope";
function func() {
return scope;
}
return func();
}
console.log(checkscope())
function checkscope2() {
var scope = "local scope";
function func() {
return scope;
}
return func;
}
console.log(checkscope2()())
这两个输出的结果都是local scope 不知道这个结果有没有让大家出乎意料。下面我给大家分析一下：
- 首先分析第一个函数:
- checkscope() 这个函数我们返回了func()
- 然后我们的func() 返回了scope
- 然后我们再调用checkscope()，就相当于则个返回值是scope，这个时候我们 函数checkscope()函数内有一个scope，全局中也有一个scope，还是根据我们的词法作用域，不管外面调用的是多么的花里胡哨，它的规则就是固定的，所以输出 local scope
- 然后分析第二个函数
- checkscope2() 这个函数返回了我们的func函数
- 然后我们checkscope2()()就相当于在全局中调用了我们的func()函数，它返回scope ，这里很容易迷惑我们，因我我们这个函数是在全局中执行的，那它的值是不是就变成了global scope？如果这样想，那就错了，我们一定要把词法作用域放在首位。func函数定义阶段始终不会改变，所以它一定还是local scope
为了让大家有更清晰的理解有了下面这个图（指出部分就是函数定义阶段）：
词法作用域简单就讲到这里了，希望能让大家明白什么是词法作用域，和怎么判断一个变量的作用域(大致就是就近原则)。
如果有错误或者不严谨的地方，请务必给予指正，十分感谢。
参考文档:
作者：Louis 深入学习js之——词法作用域和动态作用域
作者：冴羽 JavaScript深入之词法作用域和动态作用域
Recommend
-
45
堵车节第一天，我没有出门。把以前一直只限于知道，却不清晰理解的这几个概念完完整整地梳理了一番。内容参考自wiki页面，然后加上自己一些理解。 词法作用域和动态作用域 不管什么语言，我们总要学习作用域(
-
57
文章目录 前言 JS的正则表达式有两种声明方法，一种是构造函数 var reg = new RegExp(pattern, flag); ，另一种是字面量 var reg = / pattern / flag ，其中...
-
36
一直对词法分析与解析的话题比较感兴趣，最近发现了好几篇相关的优秀文章，准备好好翻译和研究下。我的理解，词法分析与解析的应用还是比较广泛的，无论简单的配置文件、各种模板语言、还是我们每天在写编程语言都离不开它。 本篇...
-
31
本文是关于词法器实现的具体介绍，如果在阅读时遇到困难，建议参考源码阅读，文中的代码片段为了介绍思路。如何解析会在下一篇介绍。 最近简单看了下 Go 源码，在 src/go 目录下有几个模块，token、scanner 和 parser 应该就是 Go...
-
26
最近发现我的翻译是越来越随性了，刚开始文章翻译的时候比较拘束，现在更多强调可读性，比如有些对文章大意没有什么影响的文字我现在都会选择直接跳过。 这篇文章主要是关于 INI 解释器的 parser 实现，它会从上一节中 Lexer 中接...
-
42
之前的 Go 笔记系列，已经完成到了开发环境搭建，原本接下来的计划就是到语法部分了，但后来一直没有前进。主要是因为当时的工作比较忙，分散了精力，于是就暂时放下了。 最近，准备重新把之前计划捡起来。 第一步，肯定是...
-
39
从词法分析角度看 Go 代码的组成 ...
-
6
javascript的词法作用域 浏览:2737次 出处信息 大家应该写过下面类似的代码吧，其实这里我想要表达的是有时候...
-
9
词法结构（Lexical Structure）是程序语言的一套基础性规则，用来描述如何使用这门语言来编写程序 JavasSript 程序是用 Unicode 字符集 编写的，Unicode 是 ASCII 和 Latin-1...
-
3
简单理解 JavaScript 的词法作用域 简单理解 JavaScript 的词法作用域更新日期: 2022-09-03阅读: 5标签:
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK