寫出更好的JavaScript之undefined篇(上)
更新時間:2009年11月22日 00:19:22 作者:
先聲明一些東西,消除歧義:這篇博文中的JavaScript是指一般意義上的JavaScript,并不只限定“自稱是JavaScript”的運行環(huán)境
“全局變量”和“全局對象的屬性”是指同樣的東西,只是因為要配合上下文才用了不同的說法,正文中我就不再另外解釋了;“聲明”指通過“var”語句聲明變量和/或?qū)瘮?shù)及其簽名的定義;“變量”指通過“var”語句聲明過或者在函數(shù)體中試圖訪問的命名參數(shù);“undefined”指名為“undefined”的值(全局或本地變量),而“未定義”指type(...) == “undefined”的情況;“output”是一個顯示傳入?yún)?shù)的函數(shù),可以看作是“alert”的同類。
我們寫JavaScript程序的時候總有需要用到“未定義”的時候,比方說我們要知道某一個值是不是已經(jīng)經(jīng)過賦值,或者我們希望消除某一個已經(jīng)賦予的值,我們就可能這樣做:
output(myVar === undefined);
myVar = undefined;
然而這樣做并不太好,如果我們嘗試“讀”(或者比較)一個不存在的變量,就會引發(fā)一個異常。
比方說如果因為設計得不夠周全,執(zhí)行上面的代碼的時候還沒有定義過myVar這個變量,上面的代碼就會出錯;
另外在較早的瀏覽器版本上,也不存在undefined這個預定義值,所以為了提高兼容性和容錯性,我們可以這樣做:
output(typeof(myVar) == "undefined");
myVar = void(0);
typeof運算符是JavaScript的語言功能,雖然上面的代碼看起來像是這樣的一種東西:
output(oneFunction(myVar) == "undefined");
myVar = void(0);
但這兩者有一個重要區(qū)別——當myVar不存在的時候,前者可以正確執(zhí)行,并返回字符串"undefined";而后者不管內(nèi)部構(gòu)造是什么樣的,都會引發(fā)異常。
void則是另一個語言功能,這個運算符的意義是向腳本的其它部分隱藏它的傳入?yún)?shù);而假如有一個語句試圖得到void“運算”的結(jié)果,它就只能得到“未定義”。
因為void的這個特性,void最常見的功能就有兩種:一是像上面的代碼中那樣將“未定義”值賦予給其它變量/屬性;另一種就是像下面這樣:
<a href="javascript:void(favList.push(curItem));">添加到收藏列表</a>
其中favList是一個JavaScript數(shù)組,而curItem是一個已經(jīng)定義的對象——數(shù)組的push方法會返回執(zhí)行push操作以后數(shù)組的長度,在這個例子里面這個長度對我們來說一點用都沒有,但如果放任它不管的話,瀏覽器就可能會跳轉(zhuǎn)到一個幾乎為空白的腳本結(jié)果頁面,只顯示push的返回值,比方說“3”。
因此需要用一個void運算符來“欺騙”瀏覽器:這里啥都沒有。
現(xiàn)在把目光回到對“未定義”的使用上,就會發(fā)現(xiàn)前面我們用來同“未定義”比較的“高容錯性”的typeof運算符,用起來有點麻煩:總共需要多寫“typeof()""”這樣10個字符。
雖然我們是成天跟麻煩打交道的程序員,但這也不能說明我們不該想辦法減少麻煩啊~各種開發(fā)工具其實不都是為了把編程工作變得簡單才出現(xiàn)的么?
所以說如果明確知道一個變量一定一定絕對絕對已經(jīng)聲明過,就可以把這個變量直接和已知的“未定義”相比較,比方說這樣:
output(myVar === void(0));
相比于使用typeof運算符,后面這個辦法除了少打幾個字符,還有一些好處:可以避免難以察覺的拼寫錯誤(比方說把“undefined”寫成“undefinied”什么的) 。
到這里,最常見的關(guān)于“undefined”/“未定義”的技巧,已經(jīng)介紹完了。
在下一篇里面,我會介紹另一些不太常見的技巧。
我們寫JavaScript程序的時候總有需要用到“未定義”的時候,比方說我們要知道某一個值是不是已經(jīng)經(jīng)過賦值,或者我們希望消除某一個已經(jīng)賦予的值,我們就可能這樣做:
復制代碼 代碼如下:
output(myVar === undefined);
myVar = undefined;
然而這樣做并不太好,如果我們嘗試“讀”(或者比較)一個不存在的變量,就會引發(fā)一個異常。
比方說如果因為設計得不夠周全,執(zhí)行上面的代碼的時候還沒有定義過myVar這個變量,上面的代碼就會出錯;
另外在較早的瀏覽器版本上,也不存在undefined這個預定義值,所以為了提高兼容性和容錯性,我們可以這樣做:
復制代碼 代碼如下:
output(typeof(myVar) == "undefined");
myVar = void(0);
typeof運算符是JavaScript的語言功能,雖然上面的代碼看起來像是這樣的一種東西:
復制代碼 代碼如下:
output(oneFunction(myVar) == "undefined");
myVar = void(0);
但這兩者有一個重要區(qū)別——當myVar不存在的時候,前者可以正確執(zhí)行,并返回字符串"undefined";而后者不管內(nèi)部構(gòu)造是什么樣的,都會引發(fā)異常。
void則是另一個語言功能,這個運算符的意義是向腳本的其它部分隱藏它的傳入?yún)?shù);而假如有一個語句試圖得到void“運算”的結(jié)果,它就只能得到“未定義”。
因為void的這個特性,void最常見的功能就有兩種:一是像上面的代碼中那樣將“未定義”值賦予給其它變量/屬性;另一種就是像下面這樣:
<a href="javascript:void(favList.push(curItem));">添加到收藏列表</a>
其中favList是一個JavaScript數(shù)組,而curItem是一個已經(jīng)定義的對象——數(shù)組的push方法會返回執(zhí)行push操作以后數(shù)組的長度,在這個例子里面這個長度對我們來說一點用都沒有,但如果放任它不管的話,瀏覽器就可能會跳轉(zhuǎn)到一個幾乎為空白的腳本結(jié)果頁面,只顯示push的返回值,比方說“3”。
因此需要用一個void運算符來“欺騙”瀏覽器:這里啥都沒有。
現(xiàn)在把目光回到對“未定義”的使用上,就會發(fā)現(xiàn)前面我們用來同“未定義”比較的“高容錯性”的typeof運算符,用起來有點麻煩:總共需要多寫“typeof()""”這樣10個字符。
雖然我們是成天跟麻煩打交道的程序員,但這也不能說明我們不該想辦法減少麻煩啊~各種開發(fā)工具其實不都是為了把編程工作變得簡單才出現(xiàn)的么?
所以說如果明確知道一個變量一定一定絕對絕對已經(jīng)聲明過,就可以把這個變量直接和已知的“未定義”相比較,比方說這樣:
復制代碼 代碼如下:
output(myVar === void(0));
相比于使用typeof運算符,后面這個辦法除了少打幾個字符,還有一些好處:可以避免難以察覺的拼寫錯誤(比方說把“undefined”寫成“undefinied”什么的) 。
到這里,最常見的關(guān)于“undefined”/“未定義”的技巧,已經(jīng)介紹完了。
在下一篇里面,我會介紹另一些不太常見的技巧。
相關(guān)文章
JS實現(xiàn)鼠標滑過鏈接改變網(wǎng)頁背景顏色的方法
這篇文章主要介紹了JS實現(xiàn)鼠標滑過鏈接改變網(wǎng)頁背景顏色的方法,涉及js響應鼠標事件動態(tài)修改頁面元素屬性的實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-10-10
詳解JavaScript數(shù)組過濾相同元素的5種方法
本篇文章主要介紹了詳解JavaScript數(shù)組過濾相同元素的5種方法,詳細的介紹了5種實用方法,非常具有實用價值,需要的朋友可以參考下2017-05-05
JS利用window.print()實現(xiàn)網(wǎng)頁打印功能
print作為瀏覽已經(jīng)比較成熟的技術(shù)可以經(jīng)常被用來打印頁面的部分內(nèi)容。本文將在JS中調(diào)用window.print()方法實現(xiàn)網(wǎng)頁打印功能,感興趣的可以跟隨小編一起學習一下2022-04-04
layer彈出層的關(guān)閉問題詳解之在執(zhí)行完畢后關(guān)閉當前彈出層
在前端頁面中用layer打開窗口供用戶輸入或選擇是非常常見的用法,但是有時為了完成一次操作,需要彈出多個窗口進行選擇、輸入或者提示,因此在關(guān)閉窗口的時候需要實現(xiàn)指定關(guān)閉任意窗口,需要的朋友可以參考下2023-10-10
使用Javascript實現(xiàn)復制粘貼功能的示例代碼
本篇文章記錄如何通過js代碼實現(xiàn)復制內(nèi)容到剪切板,之后可以粘貼到需要的地方的功能,文中通過代碼示例介紹的非常詳細,對大家的學習或工作有一定的幫助,需要的朋友可以參考下2023-09-09
mqtt.js?無法連接/錯誤提示?WebSocket?connection?to?‘ws://xxxxx‘?
這篇文章主要介紹了mqtt.js?無法連接/錯誤提示?WebSocket?connection?to?‘ws://xxxxx‘?failed:,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-01-01

