摘要：由于表達(dá)式偏啰嗦，于是最近便開(kāi)始采用來(lái)減輕負(fù)擔(dān)。規(guī)范是這么說(shuō)的在規(guī)范，有如下描述搬譯一下操作符產(chǎn)生式按如下流程解釋令為解釋執(zhí)行的結(jié)果。而如果把換成操作符寫(xiě)成，她的就不會(huì)減了，因?yàn)椴僮鞣粫?huì)對(duì)求值。

由于JS表達(dá)式偏啰嗦，于是最近便開(kāi)始采用Coffeescript來(lái)減輕負(fù)擔(dān)。舉個(gè)栗子，當(dāng)我想取屋子里的第一條dog時(shí)，首先要判斷house對(duì)象是否存在，然后再判斷house.dogs是否存在，最后取house.dogs[0]。在JS需要這么寫(xiě)

var dog = (typeof house !== "undefined && house !== null) && house.dogs && house.dogs[0]

在Coffee中，我只需要這么寫(xiě)：

dog = house?.dogs?[0];

寫(xiě)到這里，讀者會(huì)問(wèn)，這跟標(biāo)題《Javascript中的void》有一毛錢(qián)關(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代碼生成出了如此長(zhǎng)的JS代碼，看上去似乎比我最前面自己用JS寫(xiě)的更靠譜更安全，末尾還出來(lái)了兩個(gè)void 0，這究竟是何方神圣？

結(jié)構(gòu)化一下上面的例子：

dog = (typeof house !== "undefined" && house !== null) ? 
        ((_ref = house.dogs) != null ? _ref[0] : void 0 ) 
        : void 0;

如果house未定義或house為null時(shí)，返回void 0

如果house.dogs為null時(shí)，返回void 0

可void 0究竟是什么值，這個(gè)倒很容易測(cè)試:

typeof void 0 //得到"undefined"
console.log(void 0) //輸出undefined

似乎void 0就是undefined了，但這樣子路數(shù)太野，也不夠嚴(yán)謹(jǐn)，即無(wú)法回答：void 100, void hello(), void i++這無(wú)數(shù)可能組合的值是什么？

我們來(lái)瞅瞅規(guī)范是怎么說(shuō)的吧。

在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)用，即使它的值不會(huì)被用到，但是這個(gè)表達(dá)式可能會(huì)有副作用(side-effects)。

重點(diǎn)在于：無(wú)論void后的表達(dá)式是什么，void操作符都會(huì)返回undefined. 因此上面由Coffee編譯出來(lái)的代碼我們可以認(rèn)為是這樣的：

dog = (typeof house !== "undefined" && house !== null) ? 
        ((_ref = house.dogs) != null ? _ref[0] : undefined ) 
        : undefined ;

問(wèn)題來(lái)了，既然(void 0) === undefined，那直接寫(xiě)undefined不就行了么？

因?yàn)?b>undefined在javascript中不是保留字。換言之，你可以寫(xiě)出：

function joke() {
    var undefined = "hello world";
    console.log(undefined); //會(huì)輸出"hello world"
}
console.log(undefined); //輸出undefined

對(duì)的，你可以在一個(gè)函數(shù)上下文內(nèi)以u(píng)ndefined做為變量名，于是在這個(gè)上下文寫(xiě)的代碼便只能通過(guò)從全局作用域來(lái)取到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便是這么寫(xiě)的：

_.isUndefined = function(obj) {
    return obj === void 0;
}

除了采用void能保證取到undefined值以外，還有其它方法嗎？有的，還有一種方式是通過(guò)函數(shù)調(diào)用。如AngularJS的源碼里就用這樣的方式：

(function(window, document, undefined) {
    //.....
})(window, document);

通過(guò)不傳參數(shù)，確保了undefined參數(shù)的值是一個(gè)undefined。

除了取undefined外，void還有什么其它用處嗎？

還有一個(gè)常見(jiàn)的功能，填充href。下面是一個(gè)微博截圖，它的轉(zhuǎn)發(fā), 收藏， 討論都是超鏈接，但是用戶并不希望點(diǎn)擊它們會(huì)跳轉(zhuǎn)到另一個(gè)頁(yè)面，而是引發(fā)出一些交互操作。

理論上而言，這三個(gè)超鏈接都是沒(méi)有URL的，但如果不寫(xiě)的話，呵呵，點(diǎn)擊它會(huì)刷新整個(gè)頁(yè)面。于是便用上了href="javascript:void(0)的方式，確保點(diǎn)擊它會(huì)執(zhí)行一個(gè)純粹無(wú)聊的void(0)。

另一種情況是，如果我們要生成一個(gè)空的src的image，最好的方式似乎也是src="javascript:void(0)"，參見(jiàn)StackOverflow上的這個(gè)問(wèn)題：What"s the valid way to include an image with no src?

回到void的定義，有一句話特別讓人迷惑：

  
注意：GetValue一定要調(diào)用，即使它的值不會(huì)被用到，但是這個(gè)表達(dá)式可能會(huì)有副作用(side-effects)。

這是什么意思？這表示無(wú)論void右邊的表達(dá)式是什么，都要對(duì)其求值。這么說(shuō)可能不太明白，在知乎上winter大神有過(guò)闡述關(guān)于js中void，既然返回永遠(yuǎn)是undefined，那么GetValue有啥用？，我且拾人牙慧，代入一個(gè)場(chǎng)景，看代碼：

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; //沒(méi)有調(diào)用whenMarry的get方法
console.log(girl.happiness); //還是8

上述代碼定義了一個(gè)大齡文藝女青年，每被問(wèn)到什么時(shí)候結(jié)婚呀(whenMarry)，happiness都會(huì)減1。從執(zhí)行情況可以看出，無(wú)論是普通訪問(wèn)girl.whenMarry，還是void girl.whenMarry都會(huì)使她的happiness--。而如果把void換成delete操作符寫(xiě)成delete girl.whenMarry，她的happiness就不會(huì)減了，因?yàn)?b>delete操作符不會(huì)對(duì)girl.whenMarry求值。

void有如下作用：

通過(guò)采用void 0取undefined比采用字面上的undefined更靠譜更安全，應(yīng)該優(yōu)先采用void 0這種方式。

填充的href確保點(diǎn)擊時(shí)不會(huì)產(chǎn)生頁(yè)面跳轉(zhuǎn); 填充的src，確保不會(huì)向服務(wù)器發(fā)出垃圾請(qǐng)求。