尽管 JavaScript 支持一对花括号建立的代码段,可是并不支持块级做用域;
而仅仅支持 函数做用域。javascript
function test() { // 一个做用域 for(var i = 0; i < 10; i++) { // 不是一个做用域 // count } console.log(i); // 10 }
注意: 若是不是在赋值语句中,而是在 return 表达式或者函数参数中,
{...}
将会做为代码段解析,
而不是做为对象的字面语法解析。若是考虑到 自动分号插入,这可能会致使一些不易察觉的错误。java
译者注:若是 return
对象的左括号和 return
不在一行上就会出错。ajax
// 译者注:下面输出 undefined function add(a, b) { return a + b; } console.log(add(1, 2));
JavaScript 中没有显式的命名空间定义,这就意味着全部对象都定义在一个全局共享的命名空间下面。数组
每次引用一个变量,JavaScript 会向上遍历整个做用域直到找到这个变量为止。
若是到达全局做用域可是这个变量仍未找到,则会抛出 ReferenceError
异常。闭包
// 脚本 A foo = '42'; // 脚本 B var foo = '42'
上面两段脚本效果不一样。脚本 A 在全局做用域内定义了变量 foo
,而脚本 B 在当前做用域内定义变量 foo
。模块化
再次强调,上面的效果彻底不一样,不使用 var
声明变量将会致使隐式的全局变量产生。函数
// 全局做用域 var foo = 42; function test() { // 局部做用域 foo = 21; } test(); foo; // 21
在函数 test
内不使用 var
关键字声明 foo
变量将会覆盖外部的同名变量。
起初这看起来并非大问题,可是当有成千上万行代码时,不使用 var
声明变量将会带来难以跟踪的 BUG。oop
// 全局做用域 var items = [/* 数组 */]; for(var i = 0; i < 10; i++) { subLoop(); } function subLoop() { // subLoop 函数做用域 for(i = 0; i < 10; i++) { // 没有使用 var 声明变量 // 干活 } }
外部循环在第一次调用 subLoop
以后就会终止,由于 subLoop
覆盖了全局变量 i
。
在第二个 for
循环中使用 var
声明变量能够避免这种错误。
声明变量时绝对不要遗漏 var
关键字,除非这就是指望的影响外部做用域的行为。网站
JavaScript 中局部变量只可能经过两种方式声明,一个是做为函数参数,另外一个是经过 var
关键字声明。ui
// 全局变量 var foo = 1; var bar = 2; var i = 2; function test(i) { // 函数 test 内的局部做用域 i = 5; var foo = 3; bar = 4; } test(10);
foo
和 i
是函数 test
内的局部变量,而对 bar
的赋值将会覆盖全局做用域内的同名变量。
JavaScript 会提高变量声明。这意味着 var
表达式和 function
声明都将会被提高到当前做用域的顶部。
bar(); var bar = function() {}; var someValue = 42; test(); function test(data) { if (false) { goo = 1; } else { var goo = 2; } for(var i = 0; i < 100; i++) { var e = data[i]; } }
上面代码在运行以前将会被转化。JavaScript 将会把 var
表达式和 function
声明提高到当前做用域的顶部。
// var 表达式被移动到这里 var bar, someValue; // 缺省值是 'undefined' // 函数声明也会提高 function test(data) { var goo, i, e; // 没有块级做用域,这些变量被移动到函数顶部 if (false) { goo = 1; } else { goo = 2; } for(i = 0; i < 100; i++) { e = data[i]; } } bar(); // 出错:TypeError,由于 bar 依然是 'undefined' someValue = 42; // 赋值语句不会被提高规则(hoisting)影响 bar = function() {}; test();
没有块级做用域不只致使 var
表达式被从循环内移到外部,并且使一些 if
表达式更难看懂。
在原来代码中,if
表达式看起来修改了所有变量 goo
,实际上在提高规则被应用后,倒是在修改局部变量。
若是没有提高规则(hoisting)的知识,下面的代码看起来会抛出异常 ReferenceError
。
// 检查 SomeImportantThing 是否已经被初始化 if (!SomeImportantThing) { var SomeImportantThing = {}; }
实际上,上面的代码正常运行,由于 var
表达式会被提高到全局做用域的顶部。
var SomeImportantThing; // 其它一些代码,可能会初始化 SomeImportantThing,也可能不会 // 检查是否已经被初始化 if (!SomeImportantThing) { SomeImportantThing = {}; }
译者注:在 Nettuts+ 网站有一篇介绍 hoisting 的文章,其中的代码颇有启发性。
// 译者注:来自 Nettuts+ 的一段代码,生动的阐述了 JavaScript 中变量声明提高规则 var myvar = 'my value'; (function() { alert(myvar); // undefined var myvar = 'local value'; })();
JavaScript 中的全部做用域,包括全局做用域,都有一个特别的名称 this
指向当前对象。
函数做用域内也有默认的变量 arguments
,其中包含了传递到函数中的参数。
好比,当访问函数内的 foo
变量时,JavaScript 会按照下面顺序查找:
var foo
的定义。foo
名称的。foo
。注意: 自定义
arguments
参数将会阻止原生的arguments
对象的建立。
只有一个全局做用域致使的常见错误是命名冲突。在 JavaScript中,这能够经过 匿名包装器 轻松解决。
(function() { // 函数建立一个命名空间 window.foo = function() { // 对外公开的函数,建立了闭包 }; })(); // 当即执行此匿名函数
匿名函数被认为是 表达式;所以为了可调用性,它们首先会被执行。
( // 小括号内的函数首先被执行 function() {} ) // 而且返回函数对象 () // 调用上面的执行结果,也就是函数对象
有一些其余的调用函数表达式的方法,好比下面的两种方式语法不一样,可是效果如出一辙。
// 另外两种方式 +function(){}(); (function(){}());
推荐使用匿名包装器(译者注:也就是自执行的匿名函数)来建立命名空间。这样不只能够防止命名冲突,
并且有利于程序的模块化。
另外,使用全局变量被认为是很差的习惯。这样的代码倾向于产生错误和带来高的维护成本。