JavaScript 變量作用域分析

更新時(shí)間：2011年07月04日 23:07:35 作者：

變量作用域是程序中定義這個(gè)變量的區(qū)域。先貼一段代碼，如果讀者對代碼的輸出并不感到困惑就不用往下面讀了。

 
/* 代碼1 */ 
var scope = "global "; 
function checkScope() { 
var scope = "local "; 
function childCheck() { 
var scope = "childLocal "; 
document.write(scope); 
} 
function childUndefined() { 
document.write(scope); 
var scope; 
} 
function childOverride() { 
scope = "childOverride "; 
document.write(scope); 
} 
document.write(scope); //輸出"local" 
childCheck(); //輸出"childLocal" 
childUndefined(); //輸出"undefined" 
childOverride(); //輸出"childOverride" 
document.write(scope); //輸出"childOverride" 
} 
checkScope(); //輸出"local childLocal undefinedchildOverride childOverride" 
document.write(scope); //輸出"global " 

全局作用域與局部作用域
全局（global）變量的作用域是全局的，在Javascript中處處有定義；而函數(shù)內(nèi)部聲明的變量是局部（local）變量，其作用域是局部性的，只在函數(shù)體內(nèi)部有定義。對于下面的輸出讀者應(yīng)不會(huì)感到意外。

復(fù)制代碼代碼如下:

 
/* 代碼2 */ 
var scope = "global"; 
function checkScope() { 
var scope = "local"; 
document.write(scope); 
} 
checkScope(); //輸出"local" 
document.write(scope); //輸出"global" 

全局變量作用域中使用變量可以不用var語句，但在聲明局部變量是一定要使用var語句，否則會(huì)視為對全局變量的引用。看下面代碼：

復(fù)制代碼代碼如下:

 
/* 代碼3 */ 
var scope = "global"; 
function checkScope() { 
scope = "local"; 
document.write(scope); 
} 
checkScope(); //輸出"local" 
document.write(scope); //輸出"local" 

沒有塊作用域
Javascript沒有塊級作用域，函數(shù)中聲明的變量在整個(gè)函數(shù)中都是有定義的。對于下面的代碼對于生疏的讀者可能頗感意外：

復(fù)制代碼代碼如下:

 
/* 代碼4 */ 
var scope = "global"; 
function checkScope() { 
document.write(scope); //語句4.1 
var scope = "local"; //語句4.2 
document.write(scope); 
} 
checkScope(); //輸出"undefinedlocal" 

由于語句4.1（var scope = "local";）聲明的變量在整個(gè)checkScope函數(shù)作用域內(nèi)都有效，因此在語句4.2（document.write(scope); ）執(zhí)行的時(shí)scope引用的是局部變量，而此時(shí)局部變量scope尚未定義，所以輸出”undefined”。因此一個(gè)好的編程習(xí)慣是將所有的變量聲明集中起來放在函數(shù)的開頭。

在了解了上述內(nèi)容之后，讀者再看看代碼1應(yīng)該不會(huì)感到困惑了。

對象的屬性變量
對象的屬性變量比較容易理解，看一下下面的代碼讀者應(yīng)該不會(huì)感到疑惑。

復(fù)制代碼代碼如下:

 
/* 代碼5 */ 
var scope = "global "; 
var obj = new Object(); 
obj.scope = "object "; 
obj.checkScope = function () { 
var scope = "loacl "; 
document.write(scope); //輸出"loacl" 
document.write(this.scope); //輸出"object" 
document.write(window.scope); //輸出"global" 
} 
obj.checkScope(); //輸出"loacl object global" 

您可能感興趣的文章: