隱式的全域變數
局部變數
變數宣告提升(Hoisting)
名稱順序解析
function test() { // 一个作用域 for(var i = 0; i < 10; i++) { // 不是一个作用域 // count } console.log(i); // 10 }
譯者註:如果 return 物件的左括號和 return 不在一行上就會出錯。
// 译者注:下面输出 undefined function add(a, b) { return a + b; } console.log(add(1, 2));
再次強調,上面的效果完全不同,不使用 var 宣告變數將會導致隱式的全域變數產生。
// 脚本 A foo = '42'; // 脚本 B var foo = '42'
在函數 test 內不使用 var 關鍵字宣告 foo 變數將會覆寫外部的同名變數。 起初這看起來並不是大問題,但是當有成千上萬行程式碼時,不使用 var 宣告變數將會帶來難以追蹤的 BUG。
// 全局作用域 var foo = 42; function test() { // 局部作用域 foo = 21; } test(); foo; // 21
外部迴圈在第一次呼叫 subLoop 之後就會終止,因為 subLoop 覆寫了全域變數 i。 在第二個 for 迴圈中使用 var 宣告變數可以避免這種錯誤。 宣告變數時絕對不要遺漏 var 關鍵字,除非這就是期望的影響外部作用域的行為。
局部變數
JavaScript 中局部變數只可能透過兩種方式聲明,一個是作為函數參數,另一個是透過 var 關鍵字聲明。
// 全局作用域 var items = [/* 数组 */]; for(var i = 0; i < 10; i++) { subLoop(); } function subLoop() { // subLoop 函数作用域 for(i = 0; i < 10; i++) { // 没有使用 var 声明变量 // 干活 } }
JavaScript 會提升變數宣告。這表示 var 表達式和 function 宣告都會被提升到目前作用域的頂端。
// 全局变量 var foo = 1; var bar = 2; var i = 2; function test(i) { // 函数 test 内的局部作用域 i = 5; var foo = 3; bar = 4; } test(10);
上面程式碼在運作前將會被轉換。 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]; } }
沒有區塊級作用域不僅導致 var 表達式被從循環內移到外部,而且使一些 if 表達式更難看懂。
在原來程式碼中,if 表達式看起來修改了全域變數 goo,實際上在提升規則被應用後,卻是在修改局部變數。
// 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();
// 检查 SomeImportantThing 是否已经被初始化 if (!SomeImportantThing) { var SomeImportantThing = {}; }
var SomeImportantThing; // 其它一些代码,可能会初始化 SomeImportantThing,也可能不会 // 检查是否已经被初始化 if (!SomeImportantThing) { SomeImportantThing = {}; }
名稱解析順序
JavaScript 中的所有作用域,包括全域作用域,都有一個特別的名稱 this 指向目前物件。函數作用域內也有預設的變數 arguments,其中包含了傳遞到函數中的參數。例如,當存取函數內的 foo 變數時,JavaScript 會依照下面順序來找出:目前作用域內是否有 var foo 的定義。函數形式參數是否有使用 foo 名稱的。
// 译者注:来自 Nettuts+ 的一段代码,生动的阐述了 JavaScript 中变量声明提升规则 var myvar = 'my value'; (function() { alert(myvar); // undefined var myvar = 'local value'; })();
(function() { // 函数创建一个命名空间 window.foo = function() { // 对外公开的函数,创建了闭包 }; })(); // 立即执行此匿名函数
( // 小括号内的函数首先被执行 function() {} ) // 并且返回函数对象 () // 调用上面的执行结果,也就是函数对象