前言
任务三 Global Scope & Shadowing
全局作用域和变量遮蔽
全局作用域(Global Scope)
理解作用域链在哪结束很重要!
所有的JS运行时环境都必须隐式创建一个全局作用域对象(浏览器中是window
,node中是global
),这个对象就位于作用域链的顶端:
(global)
↑
|
someFunc()
↑
/ \
/ \
/ \
inner() inner2()
↑
|
foo()
在任务一中,我们忽略了一个细节,即当不使用var
或者let
等定义变量的时候,这个变量就暴露给了外部作用域。
JS运行环境根据以下算法来赋值一个变量:
查找当前作用域
如果没找到,查找直接外部作用域
如果找到,至6
如果没找到,重复2和3直到到达全局作用域
如果在全局作用域没有找到,创建之(在
window
或global
对象上)赋值
这样的话,在第5步就有可能意外创建一个全局变量了
全局作用域 栗子:
function someFunc() {
var scopedVar = 1;
function inner() {
foo = 2;
}
}
注意到foo
的定义缺少了var
或者let
。
JS运行环境就会根据上面的算法,先查找inner()
,然后是someFunc()
,最好是全局作用域,第5步被执行了,所以foo
变成了全局变量(window.foo
/global.foo
)
换一种说法:当你忘了写var
,本来在inner
中定义的变量foo
就可能被外部作用域修改,所以someFunc()
这个作用域就有了本不该有的权限(访问内部变量foo
)
记好了:只有内部作用域可以访问外部作用域,在上面的例子中someFunc()
是在全局作用域里面,所以才可以访问foo
变量遮蔽(Shadowing)
在上面的算法中,变量的创建属于其中的第0步
:当var
或let
被使用,变量就被绑定在了当前作用域,然后任何该变量的赋值部分再继续上面的算法。
在两个不同作用域中定义两个名字完全相同的变量也是可以的:
function someFunc() {
var foo = 1;
}
function anotherFunc() {
var foo = 2;
}
同样在嵌套作用域中这样做也可以:
function someFunc() {
var foo = 1;
function inner() {
var foo = 2;
}
}
这就叫变量遮蔽,inner()
中的foo
遮蔽(Shadow)住了someFunc
中的foo
即:inner()
作用域只能访问自己的foo
,无法再访问定义在someFunc()
中的foo
当然,这种行为在深度嵌套或者巨型函数中也容易导致bug,需要多加注意!
你的任务
修改你之前的任务代码,为foo()
中的全局变量quux
(不使用var
或者let
定义)赋一个值,在zip()
中定义一个影子变量quux
。同时这两个变量的值不要相同。
完成后执行:scope-chains-closures verify <your-file.js>
验证答案
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。