摘要:由于表達(dá)式偏啰嗦,于是最近便開始采用來減輕負(fù)擔(dān)。規(guī)范是這么說的在規(guī)范,有如下描述搬譯一下操作符產(chǎn)生式按如下流程解釋令為解釋執(zhí)行的結(jié)果。而如果把換成操作符寫成,她的就不會減了,因?yàn)椴僮鞣粫η笾怠?/p>
由于JS表達(dá)式偏啰嗦,于是最近便開始采用Coffeescript來減輕負(fù)擔(dān)。舉個栗子,當(dāng)我想取屋子里的第一條dog時,首先要判斷house對象是否存在,然后再判斷house.dogs是否存在,最后取house.dogs[0]。在JS需要這么寫
var dog = (typeof house !== "undefined && house !== null) && house.dogs && house.dogs[0]
在Coffee中,我只需要這么寫:
dog = house?.dogs?[0];
寫到這里,讀者會問,這跟標(biāo)題《Javascript中的void》有一毛錢關(guān)系?Coffee的本質(zhì)就是JS,之所以Coffee能工作的很好,是因?yàn)樗沙隽烁咝Ф医训腏S代碼,我們可以看看它的生成結(jié)果。
var dog, _ref; dog = typeof house !== "undefined" && house !== null ? (_ref = house.dogs) != null ? _ref[0] : void 0 : void 0;
短短一行Coffee代碼生成出了如此長的JS代碼,看上去似乎比我最前面自己用JS寫的更靠譜更安全,末尾還出來了兩個void 0,這究竟是何方神圣?
結(jié)構(gòu)化一下上面的例子:
dog = (typeof house !== "undefined" && house !== null) ? ((_ref = house.dogs) != null ? _ref[0] : void 0 ) : void 0;
如果house未定義或house為null時,返回void 0
如果house.dogs為null時,返回void 0
可void 0究竟是什么值,這個倒很容易測試:
typeof void 0 //得到"undefined" console.log(void 0) //輸出undefined
似乎void 0就是undefined了,但這樣子路數(shù)太野,也不夠嚴(yán)謹(jǐn),即無法回答:void 100, void hello(), void i++這無數(shù)可能組合的值是什么?
我們來瞅瞅規(guī)范是怎么說的吧。
規(guī)范是這么說的在ECMAScript 262規(guī)范,有如下描述:
The void Operator
The production UnaryExpression : void UnaryExpression is evaluated as follows:
Let expr be the result of evaluating UnaryExpression.
Call GetValue(expr).
Return undefined.
NOTE: GetValue must be called even though its value is not used because it may have observable side-effects.
搬譯一下:
void操作符
產(chǎn)生式 UnaryExpression : void UnaryExpression 按如下流程解釋:
令 expr 為解釋執(zhí)行UnaryExpression的結(jié)果。
調(diào)用 GetValue(expr).
返回 undefined.
注意:GetValue一定要調(diào)用,即使它的值不會被用到,但是這個表達(dá)式可能會有副作用(side-effects)。
重點(diǎn)在于:無論void后的表達(dá)式是什么,void操作符都會返回undefined. 因此上面由Coffee編譯出來的代碼我們可以認(rèn)為是這樣的:
dog = (typeof house !== "undefined" && house !== null) ? ((_ref = house.dogs) != null ? _ref[0] : undefined ) : undefined ;
問題來了,既然(void 0) === undefined,那直接寫undefined不就行了么?
為什么要用void?因?yàn)?b>undefined在javascript中不是保留字。換言之,你可以寫出:
function joke() { var undefined = "hello world"; console.log(undefined); //會輸出"hello world" } console.log(undefined); //輸出undefined
對的,你可以在一個函數(shù)上下文內(nèi)以undefined做為變量名,于是在這個上下文寫的代碼便只能通過從全局作用域來取到undefined,如:
window.undefined //瀏覽器環(huán)境 GLOBAL.undefined //Node環(huán)境
但要注意的是,即便window, GLOBAL仍然可以在函數(shù)上下文被定義,故從window/GLOBAL上取undefined并不是100%可靠的做法。如:
function x() { var undefined = "hello world", f = {}, window = { "undefined": "joke" }; console.log(undefined);// hello world console.log(window.undefined); //joke console.log(f.a === undefined); //false console.log(f.a === void 0); //true }
于是,采用void方式獲取undefined便成了通用準(zhǔn)則。如underscore.js里的isUndefined便是這么寫的:
_.isUndefined = function(obj) { return obj === void 0; }
除了采用void能保證取到undefined值以外,還有其它方法嗎?有的,還有一種方式是通過函數(shù)調(diào)用。如AngularJS的源碼里就用這樣的方式:
(function(window, document, undefined) { //..... })(window, document);
通過不傳參數(shù),確保了undefined參數(shù)的值是一個undefined。
其它作用除了取undefined外,void還有什么其它用處嗎?
還有一個常見的功能,填充href。下面是一個微博截圖,它的轉(zhuǎn)發(fā), 收藏, 討論都是超鏈接,但是用戶并不希望點(diǎn)擊它們會跳轉(zhuǎn)到另一個頁面,而是引發(fā)出一些交互操作。
理論上而言,這三個超鏈接都是沒有URL的,但如果不寫的話,呵呵,點(diǎn)擊它會刷新整個頁面。于是便用上了href="javascript:void(0)的方式,確保點(diǎn)擊它會執(zhí)行一個純粹無聊的void(0)。
另一種情況是,如果我們要生成一個空的src的image,最好的方式似乎也是src="javascript:void(0)",參見StackOverflow上的這個問題:What"s the valid way to include an image with no src?
寫在最后回到void的定義,有一句話特別讓人迷惑:
注意:GetValue一定要調(diào)用,即使它的值不會被用到,但是這個表達(dá)式可能會有副作用(side-effects)。
這是什么意思?這表示無論void右邊的表達(dá)式是什么,都要對其求值。這么說可能不太明白,在知乎上winter大神有過闡述關(guān)于js中void,既然返回永遠(yuǎn)是undefined,那么GetValue有啥用?,我且拾人牙慧,代入一個場景,看代碼:
var happiness = 10; var girl = { get whenMarry() { happiness--; return 1/0; //Infinity }, get happiness() { return happiness; } }; console.log(girl.whenMarry); //調(diào)用了whenMarry的get方法 console.log(girl.happiness); // 9 void girl.whenMarry; //調(diào)用了whenMarry的get方法 console.log(girl.happiness); // 8 delete girl.whenMarry; //沒有調(diào)用whenMarry的get方法 console.log(girl.happiness); //還是8
上述代碼定義了一個大齡文藝女青年,每被問到什么時候結(jié)婚呀(whenMarry),happiness都會減1。從執(zhí)行情況可以看出,無論是普通訪問girl.whenMarry,還是void girl.whenMarry都會使她的happiness--。而如果把void換成delete操作符寫成delete girl.whenMarry,她的happiness就不會減了,因?yàn)?b>delete操作符不會對girl.whenMarry求值。
總結(jié)void有如下作用:
通過采用void 0取undefined比采用字面上的undefined更靠譜更安全,應(yīng)該優(yōu)先采用void 0這種方式。
填充的href確保點(diǎn)擊時不會產(chǎn)生頁面跳轉(zhuǎn); 填充
- 完 -
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/78059.html
摘要:眾多面向?qū)ο蟮木幊趟枷腚m不盡一致,但是無論哪種面向?qū)ο缶幊陶Z言都具有以下的共通功能。原型編程以類為中心的傳統(tǒng)面向?qū)ο缶幊蹋且灶悶榛A(chǔ)生成新對象。而原型模式的面向?qū)ο缶幊陶Z言沒有類這樣一個概念。 什么是面向?qū)ο螅窟@個問題往往會問到剛畢業(yè)的新手or實(shí)習(xí)生上,也是往往作為一個技術(shù)面試的開頭題。在這里我們不去談如何答(fu)好(yan)問(guo)題(qu),僅談?wù)勎宜斫獾拿嫦驅(qū)ο蟆?從歷...
摘要:談?wù)勎易銎匆羲阉鞯囊稽c(diǎn)經(jīng)驗(yàn)需要注意的一些事情本文使用的為語言解決方案。當(dāng)然也我們可以自己實(shí)現(xiàn)轉(zhuǎn)換拼音的功能,如果這樣做,則需要在代碼中設(shè)定好中文字庫和對應(yīng)的拼音,同時特別注意多音字的處理。 談?wù)勎易銎匆羲阉鞯囊稽c(diǎn)經(jīng)驗(yàn) 需要注意的一些事情 本文使用的為 Java 語言解決方案。 搜索方法上,按照個人理解,有兩點(diǎn)關(guān)鍵: 分詞 將類似 women 這樣的詞分解成 women。經(jīng)過這...
摘要:會一直完善下去,歡迎建議和指導(dǎo),同時也歡迎中用到了那些設(shè)計(jì)模式中用到了那些設(shè)計(jì)模式這兩個問題,在面試中比較常見。工廠設(shè)計(jì)模式使用工廠模式可以通過或創(chuàng)建對象。 我自己總結(jié)的Java學(xué)習(xí)的系統(tǒng)知識點(diǎn)以及面試問題,已經(jīng)開源,目前已經(jīng) 41k+ Star。會一直完善下去,歡迎建議和指導(dǎo),同時也歡迎Star: https://github.com/Snailclimb... JDK 中用到了那...
摘要:源碼剖析之設(shè)計(jì)模式鑒賞策略模式小結(jié)在這篇文章中筆者和大家分享幾個減少的小由于這些都會有一定的限制因此還向大家介紹了幾個能夠避免寫出糟糕的的設(shè)計(jì)模式并使用觀察者模式簡單的改進(jìn)了仲裁者模式的例子 本文首發(fā)于數(shù)據(jù)浮云:https://mp.weixin.qq.com/s?__... 在寫代碼的日常中,if...else語句是極為常見的.正因其常見性,很多同學(xué)在寫代碼的時候并不會去思考其在目...
閱讀 3273·2021-09-22 16:06
閱讀 3260·2021-09-02 15:40
閱讀 642·2019-08-30 15:54
閱讀 1047·2019-08-26 12:22
閱讀 1391·2019-08-26 12:17
閱讀 2753·2019-08-26 12:09
閱讀 513·2019-08-26 10:20
閱讀 796·2019-08-23 16:28