变量、作用域、闭包 - 版本历史

Eijux：/* 作用域参考：《【JavaScript】深入理解JS中的词法作用域与作用域链》 */

2023-04-17T23:34:00Z

作用域参考：《【JavaScript】深入理解JS中的词法作用域与作用域链》

←上一版本		2023年4月18日 (二) 07:34的版本
第117行：		第117行：
	\|}		\|}

	== 作用域<ref group="MDN" name="Scope"/><ref>参考：[https://juejin.cn/post/7069578126979760158 《【JavaScript】深入理解JS中的词法作用域与作用域链》]</ref> ==		== 作用域<ref group="MDN" name="Scope"/><ref group="Wikioe" name="lexical-environment"/><ref>参考：[https://juejin.cn/post/7069578126979760158 《【JavaScript】深入理解JS中的词法作用域与作用域链》]</ref> ==
	<big>'''作用域'''</big>是当前的执行上下文，值和表达式在其中“可见”或可被访问。		<big>'''作用域'''</big>是当前的执行上下文，值和表达式在其中“可见”或可被访问。

Eijux：/* Wikioe */

2023-04-17T23:27:10Z

Wikioe

←上一版本		2023年4月18日 (二) 07:27的版本
第447行：		第447行：
	=== Wikioe ===		=== Wikioe ===
	<references group="Wikioe">		<references group="Wikioe">
	<ref group="Wikioe" name="lexical-environment">参考：【[[JS 执行过程：执行上下文、词法环境]]】</ref>		<ref group="Wikioe" name="lexical-environment">参考：【'''[[JS 执行过程：执行上下文、词法环境]]'''】</ref>
	</references>		</references>

Eijux：/* Wikioe */

2023-04-16T19:02:36Z

Wikioe

←上一版本		2023年4月17日 (一) 03:02的版本
第447行：		第447行：
	=== Wikioe ===		=== Wikioe ===
	<references group="Wikioe">		<references group="Wikioe">
	<ref group="Wikioe" name="lexical-environment">参考：【[[~~词法环境（lexical environment）~~]]】</ref>		<ref group="Wikioe" name="lexical-environment">参考：【[[JS 执行过程：执行上下文、词法环境]]】</ref>
	</references>		</references>

	=== MDN ===		=== MDN ===
	<references group="MDN">		<references group="MDN">

Eijux：/* 作用域模型：词法作用域参考：《JavaScript 中的词法作用域——JS 中的作用域究竟是什么？》 */

2023-04-16T18:49:05Z

作用域模型：词法作用域参考：《JavaScript 中的词法作用域——JS 中的作用域究竟是什么？》

←上一版本		2023年4月17日 (一) 02:49的版本
第152行：		第152行：
	:# 使用该变量：输出 20		:# 使用该变量：输出 20

	=== ~~作用域模型：词法作用域~~<ref>参考：[https://www.freecodecamp.org/chinese/news/javascript-lexical-scope-tutorial/ 《JavaScript 中的词法作用域——JS 中的作用域究竟是什么？》]</ref> ===		=== 作用域模型：<span style="color: blue">'''词法作用域'''</span><ref>参考：[https://www.freecodecamp.org/chinese/news/javascript-lexical-scope-tutorial/ 《JavaScript 中的词法作用域——JS 中的作用域究竟是什么？》]</ref> ===
	<div class="mw-code" style="white-space: normal; line-height: 1.6;">		<div class="mw-code" style="white-space: normal; line-height: 1.6;">
	从语言的层面来说，作用域模型分两种：（根据作用域的生成时机）		从语言的层面来说，作用域模型分两种：（根据作用域的生成时机）
第161行：		第161行：
	</div>		</div>

	<span style="color: green">'''词法作用域（Lexical Scope）'''</span>~~：即“词法分析时生成的作用域”，根据源代码中“声明变量的位置”来确定该变量在何处可用~~		<span style="color: green">'''词法作用域（Lexical Scope）'''</span>：即“词法分析时生成的作用域”，'''根据源代码中“声明变量的位置”来确定该变量在何处可用'''

	示例：		示例：
第175行：		第175行：
	: 变量 x 的“词法作用域”为“全局作用域”（定义时的作用域）而非“getX 函数作用域”		: 变量 x 的“词法作用域”为“全局作用域”（定义时的作用域）而非“getX 函数作用域”

	<big>⭐</big> ~~一个声明（定义变量、函数等）的词法作用域就是其“~~'''定义时的作用域'''” —— ~~注意：并不是“调用时的作用域”~~
			<big>⭐</big> 一个声明（定义变量、函数等）的“词法作用域”就是其“<span style="color: blue; font-size: 120%">'''定义时的作用域'''</span>” —— 注意：<span style="color: red">'''并不是“调用时的作用域”'''</span>

			示例：
			: <syntaxhighlight lang="JavaScript" highlight="">
			var x = 0

			function foo() {
			var x = 1
			bar()
			}
			function bar() {
			console.log(x) // 0
			}

			foo()
			</syntaxhighlight>
			: 由于“词法作用域”（定义时的作用域）决定了：foo、bar 的上级作用域是“全局作用域”，所以 bar 中使用的 x 来自“全局作用域”而非“foo 函数作用域”


	==== 欺骗“词法作用域” ====		==== 欺骗“词法作用域” ====

2023年4月16日 (日) 17:36 Eijux

2023-04-16T17:36:13Z

显示更改

Eijux：Eijux移动页面变量、词法作用域、闭包至变量、作用域、闭包，不留重定向

2023-04-16T09:32:56Z

Eijux移动页面变量、词法作用域、闭包至变量、作用域、闭包，不留重定向

←上一版本	2023年4月16日 (日) 17:32的版本
（没有差异）

2023年4月16日 (日) 09:32 Eijux

2023-04-16T09:32:41Z

←上一版本		2023年4月16日 (日) 17:32的版本
第163行：		第163行：
	<span style="color: green">'''词法作用域（Lexical Scope）'''</span>：即“词法分析时生成的作用域”，根据源代码中“声明变量的位置”来确定该变量在何处可用		<span style="color: green">'''词法作用域（Lexical Scope）'''</span>：即“词法分析时生成的作用域”，根据源代码中“声明变量的位置”来确定该变量在何处可用

	: 示例：		示例：
	: <syntaxhighlight lang="JavaScript" highlight="">		: <syntaxhighlight lang="JavaScript" highlight="">
	let x = "Eijux";		let x = "Eijux";
第178行：		第178行：

	==== 欺骗“词法作用域” ====		==== 欺骗“词法作用域” ====
	~~虽然“词法作用域”在代码编写时就确定，但仍然可以通过~~ '''eval()''' 和 '''with''' ~~语句来修改。~~		<div class="mw-code" style="white-space: normal; line-height: 1.6;">
			虽然“词法作用域”在代码编写时就确定，但仍然可以修改：
	~~—— eval()：有性能和安全隐患，不建议使用~~		# '''eval()'''<ref group="MDN" name="eval"/>：将传入的字符串当做 JavaScript 代码进行执行
	~~—— with：有语义不明和兼容问题，已弃用~~		#*有性能和安全隐患，'''不建议使用'''
			# '''with'''<ref group="MDN" name="with"/>：扩展一个语句的作用域链
			#* 有语义不明和兼容问题，'''已弃用'''
			</div>

	#		# 通过 eval() 修改词法作用域：
	: <syntaxhighlight lang="JavaScript" highlight="">		#: <syntaxhighlight lang="JavaScript" highlight="">
	var num = 10		var num = 10
	var str = "var num = 20"		var str = "var num = 20"
第194行：		第197行：

	fn(str)		fn(str)
			</syntaxhighlight>
			# 通过 with 修改词法作用域：
			#: <syntaxhighlight lang="JavaScript" highlight="">
			var x = { a: 1 }

			function fn(obj) {
			with (obj) {
			a = 2
			}
			}

			console.log(x.a) // 1
			fn(x)
			console.log(x.a) // 2
	</syntaxhighlight>		</syntaxhighlight>

	== 闭包 ==		== 闭包<ref group="MDN" name="closure"/><ref group="javascript.info" name="closure"/> ==


第202行：		第219行：
	== 补充内容 ==		== 补充内容 ==

	=== var 没有“块作用域”<ref group="javascript.info" name="var"/> ===		=== '''var 没有“块作用域”'''<ref group="javascript.info" name="var"/> ===
	<big>⭐</big> <span style="color: blue">'''var 变量没有“块作用域”'''：将会使用（块所在的）“函数作用域”或“全局作用域”</span> —— 这是因为在早期的 JavaScript 中，块没有<span style="color: red">'''词法环境'''</span>		<big>⭐</big> <span style="color: blue">'''var 变量没有“块作用域”'''：将会使用（块所在的）“函数作用域”或“全局作用域”</span> —— 这是因为在早期的 JavaScript 中，块没有<span style="color: red">'''词法环境'''</span>

第315行：		第332行：
	<references group="MDN">		<references group="MDN">
	<ref group="MDN" name="Variables">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Grammar_and_Types MDN：《语法和数据类型》]</ref>		<ref group="MDN" name="Variables">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Grammar_and_Types MDN：《语法和数据类型》]</ref>
			<ref group="MDN" name="Hoisting">参考：[https://developer.mozilla.org/zh-CN/docs/Glossary/Hoisting MDN：《Hoisting（变量提升）》]</ref>
	<ref group="MDN" name="function">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/function MDN：《function》]</ref>		<ref group="MDN" name="function">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/function MDN：《function》]</ref>
	<ref group="MDN" name="var">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/var MDN：《var》]</ref>		<ref group="MDN" name="var">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/var MDN：《var》]</ref>
	<ref group="MDN" name="let">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let MDN：《let》]</ref>		<ref group="MDN" name="let">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/let MDN：《let》]</ref>
	<ref group="MDN" name="Scope">参考：[https://developer.mozilla.org/zh-CN/docs/Glossary/Scope MDN：《Scope（作用域）》]</ref>		<ref group="MDN" name="Scope">参考：[https://developer.mozilla.org/zh-CN/docs/Glossary/Scope MDN：《Scope（作用域）》]</ref>
	<ref group="MDN" name="~~Hoisting~~">参考：[https://developer.mozilla.org/zh-CN/docs/~~Glossary~~/~~Hoisting MDN：《Hoisting（变量提升）》~~]</ref>		<ref group="MDN" name="eval">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/eval MDN：《eval()》]</ref>
			<ref group="MDN" name="with">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/with MDN：《with》]</ref>
			<ref group="MDN" name="closure">参考：[https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Closures MDN：《闭包》]</ref>
	</references>		</references>
	=== javascript.info ===		=== javascript.info ===
	<references group="javascript.info">		<references group="javascript.info">
	<ref group="javascript.info" name="var">参考：[https://zh.javascript.info/var javascript.info：《老旧的 "var"》]</ref>		<ref group="javascript.info" name="var">参考：[https://zh.javascript.info/var javascript.info：《老旧的 "var"》]</ref>
			<ref group="javascript.info" name="closure">参考：[https://zh.javascript.info/closure javascript.info：《变量作用域，闭包》]</ref>
	</references>		</references>
	=== 其他 ===		=== 其他 ===
	<references/>		<references/>

Eijux：/* 欺骗“词法作用域” */

2023-04-16T09:04:22Z

欺骗“词法作用域”

←上一版本		2023年4月16日 (日) 17:04的版本
第178行：		第178行：

	==== 欺骗“词法作用域” ====		==== 欺骗“词法作用域” ====
			虽然“词法作用域”在代码编写时就确定，但仍然可以通过 '''eval()''' 和 '''with''' 语句来修改。

			—— eval()：有性能和安全隐患，不建议使用
			—— with：有语义不明和兼容问题，已弃用

			#
			: <syntaxhighlight lang="JavaScript" highlight="">
			var num = 10
			var str = "var num = 20"

			function fn(str) {
			eval(str)
			console.log(num)
			}

			fn(str)
			</syntaxhighlight>


	== 闭包 ==		== 闭包 ==

2023年4月16日 (日) 08:34 Eijux

2023-04-16T08:34:43Z

显示更改

Eijux：/* let 有没有“提升”？ */

2023-04-16T05:31:36Z

let 有没有“提升”？

←上一版本		2023年4月16日 (日) 13:31的版本
第159行：		第159行：
	var 和 let 的另一个重要区别，let 声明的变量不会在作用域中被提升，它是在编译时才初始化（参考下面的暂时性死区）。		var 和 let 的另一个重要区别，let 声明的变量不会在作用域中被提升，它是在编译时才初始化（参考下面的暂时性死区）。

	~~各种说法大都以一个类似示例来说明：~~		两种说法，以一个类似示例来说明：
	: <syntaxhighlight lang="JavaScript" highlight="">		: <syntaxhighlight lang="JavaScript" highlight="">
	var foo = 33;		var foo = 33;
第168行：		第168行：
	</syntaxhighlight>		</syntaxhighlight>
	对于 ReferenceError 该如何解释呢 ❓		对于 ReferenceError 该如何解释呢 ❓
	: ~~网上有说法，认为是由于“let 变量提升导致”~~		# 说法一：由于 let 变量提升，导致此处使用“块作用域内定义变量”，但该变量处于“暂时性死区”，所以出现此错误。
			#: 网上有内容更是强行将 let 变量创建分为三个过程：创建、初始化、赋值 …… 有点扯。
			# 说法二：由于'''词法作用域'''，导致此处使用“块作用域内定义变量”，但该变量处于“暂时性死区”，所以出现此错误。

			<big>💡</big> 个人理解：let 并不会提升，以上示例是“词法作用域”影响。—— 或许看看 JS 引擎执行过程更清楚

	== <span style="color: green">'''一个有意思的例子'''</span> ==		== <span style="color: green">'''一个有意思的例子'''</span> ==

变量、作用域、闭包 - 版本历史

Eijux：​/* 作用域参考：《【JavaScript】深入理解JS中的词法作用域与作用域链》 */

Eijux：​/* Wikioe */

Eijux：​/* Wikioe */

Eijux：​/* 作用域模型：词法作用域参考：《JavaScript 中的词法作用域——JS 中的作用域究竟是什么？》 */

2023年4月16日 (日) 17:36 Eijux

Eijux：​Eijux移动页面变量、词法作用域、闭包至变量、作用域、闭包，不留重定向

2023年4月16日 (日) 09:32 Eijux

Eijux：​/* 欺骗“词法作用域” */

2023年4月16日 (日) 08:34 Eijux

Eijux：​/* let 有没有“提升”？ */

Eijux：/* 作用域参考：《【JavaScript】深入理解JS中的词法作用域与作用域链》 */

Eijux：/* Wikioe */

Eijux：/* Wikioe */

Eijux：/* 作用域模型：词法作用域参考：《JavaScript 中的词法作用域——JS 中的作用域究竟是什么？》 */

Eijux：Eijux移动页面变量、词法作用域、闭包至变量、作用域、闭包，不留重定向

Eijux：/* 欺骗“词法作用域” */

Eijux：/* let 有没有“提升”？ */