|
系列文章導(dǎo)航:
JavaScript學(xué)習(xí)筆記一——數(shù)據(jù)類型
JavaScript學(xué)習(xí)筆記二——函數(shù)
JavaScript學(xué)習(xí)筆記三——作用域
JavaScript學(xué)習(xí)筆記四——Eval函數(shù)
JavaScript學(xué)習(xí)筆記五——類和對(duì)象
JavaScript學(xué)習(xí)筆記六:prototype的提出
Javascript學(xué)習(xí)筆記七——原型鏈的原理
Javascript學(xué)習(xí)筆記八——用JSON做原型
Javascript學(xué)習(xí)筆記九——prototype封裝繼承
Javascript學(xué)習(xí)筆記十——網(wǎng)頁運(yùn)行原理
Javascript學(xué)習(xí)筆記十一——包裝DOM對(duì)象
Javascript學(xué)習(xí)筆記十三——關(guān)于響應(yīng)事件
Javascript學(xué)習(xí)筆記十二——Ajax入門
每個(gè)寫過程序的人都不會(huì)對(duì)作用域這個(gè)概念陌生,那在這篇文章中就來談下Javascript的作用域。
在Javascript,全局環(huán)境本身就一個(gè)對(duì)象。在瀏覽器宿主中這個(gè)對(duì)象是window,而當(dāng)Javascript用于其它非瀏覽器的宿主,如嵌入式的環(huán)境中,可能會(huì)是其它的對(duì)象。
在這里也糾正一個(gè)觀念,有很多人都認(rèn)為Javascript只在瀏覽器中使用,其實(shí)Javascript也能在很多非Web情況下使用,據(jù)介紹Javascript在一些基于嵌入式的應(yīng)用領(lǐng)域表現(xiàn)得也很出色,當(dāng)然這些我也只是聽過傳說而已。
言歸正傳,當(dāng)我們寫下:var i=1時(shí),其實(shí)就是聲明了一個(gè)window作用域的一個(gè)變量。
而當(dāng)我們寫下i=1時(shí),是聲明了一個(gè)window的屬性。
看這樣一段代碼:
<script type="text/Javascript"> var a = "hello"; b = "world"; Test(); function Test() { alert(a + " " + b); var a = "welcome"; b = "china"; alert(a + " " + b); } alert(a + " " + b); script>
這段代碼分別輸出的結(jié)果是:undefined world,welcome china, hello china.
我們來分別解釋:
在上文中,我們說過,在Javascript預(yù)編譯時(shí),會(huì)把所有var變量創(chuàng)建,默認(rèn)值為undefined,我們?cè)谶@里可以舉一個(gè)例子:
我們可以寫這樣一段代碼:
<script type="text/Javascript"> alert(a); alert(b); var a = "111"; b = "111"; script>
當(dāng)我們執(zhí)行運(yùn)行這段腳本時(shí),可以發(fā)現(xiàn),首先彈出undefined,然后回提示腳本錯(cuò)誤,提示b不存在。由此就可以表明,a在預(yù)編譯的過程中就已經(jīng)被創(chuàng)建并且初始化為undefined,而b卻只能在實(shí)際運(yùn)行時(shí)按順序去解釋。其實(shí)在預(yù)編譯后的Javascript代碼可以近乎理解如下:
<script type="text/Javascript"> var a = undefined; alert(a); alert(b); a = "111"; b = "111"; script>
接下來我們可以談一下函數(shù)的作用域問題,每當(dāng)代碼運(yùn)行進(jìn)入一個(gè)函數(shù)時(shí),Javascript引擎就會(huì)自動(dòng)創(chuàng)建一個(gè)新的作用域,然后把這個(gè)新作用域作為當(dāng)前作用域的子作用域,然后把當(dāng)前的代碼作用域切換到這個(gè)新作用域。當(dāng)代碼退出函數(shù)時(shí),這個(gè)作用域銷毀,把代碼作用域交還給他的父作用域。
好,準(zhǔn)備工作差不多了,接下來我們就來解釋第一個(gè)問題:?jiǎn)柺裁磿?huì)輸出undefined world。
首先代碼進(jìn)行在預(yù)編譯,當(dāng)進(jìn)入 Test方法時(shí),開啟一個(gè)新作用域,然后把全局作用域作為他的父作用域。然后對(duì)Test內(nèi)的方法進(jìn)行預(yù)編譯,和上面的代碼一樣,Test方法被預(yù)編譯后方法體大致如下:
function Test() { var a = undefined; alert(a + " " + b); var a = "welcome"; b = "china"; alert(a + " " + b);}
當(dāng)然,在當(dāng)前作用域下無法找到b,于是他就會(huì)到他的父作用域下,也就是全局作用域找到了b=“world”。于是也就產(chǎn)生了這樣的結(jié)果。
第二次彈出welcome china,沒什么好說的。
第三次,彈出hello china。我們可以這樣理解,var a 只是 方法Test的一個(gè)局部變量,而b由于事先未聲明,因此他會(huì)去父作用域中去找到對(duì)應(yīng)的定義。
好,接下來,我們?cè)倏匆幌逻@個(gè)方法的若干個(gè)變體。
<script type="text/Javascript"> var a = "hello"; b = "world"; Test(); function Test() { alert(a + " " + b); a = "welcome"; b = "china"; alert(a + " " + b); } alert(a + " " + b); script>
首先,我們將方法體內(nèi)的var a改成a,我們先不看答案,直接來分析,首先,在預(yù)編譯階段,方法體內(nèi)幾乎沒有任何改變,因此此時(shí)a和b一樣,都要去他們的父作用域中去尋找,因此第一次出的結(jié)果應(yīng)該是hello world,第二次沒什么說的:welcome china,第三次由于a和b在本作用域內(nèi)都沒有事先定義,因此都是再改變父作用域內(nèi)的值,因此應(yīng)該輸出welcome china.
我們繼續(xù):
<script type="text/Javascript"> var a = "hello"; b = "world"; Test(); function Test() { alert(a + " " + b); var a = "welcome"; var b = "china"; alert(a + " " + b); } alert(a + " " + b); script>
和上面的分析一樣,應(yīng)該輸出undefined undefined,welcome china,hello world.
繼續(xù):
<script type="text/Javascript"> a = "hello"; b = "world"; Test(); function Test() { alert(a + " " + b); var a = "welcome"; b = "china"; alert(a + " " + b); } alert(a + " " + b); script>
應(yīng)該是undefined world,welcome china,hello china.
經(jīng)試驗(yàn),都沒問題, 不知道你明白了么?
因此我們可以得出,每個(gè)變量在找不到自己的定義時(shí),都會(huì)沿著作用鏈向上尋找,這樣就很可能會(huì)出現(xiàn)未預(yù)知的錯(cuò)誤,給排錯(cuò)添加了很多困難。更麻煩的是,還可能會(huì)對(duì)父作用域上的變量值進(jìn)行修改,因此我們?cè)诼暶髯兞繒r(shí)應(yīng)該盡量加上var,盡管Javascript并不強(qiáng)迫我們這樣做。
it知識(shí)庫(kù):JavaScript學(xué)習(xí)筆記三——作用域,轉(zhuǎn)載需保留來源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除,多謝。