魔鬼細節 - Javascript Comma Operator

Posted on  Feb 5, 2018  in  Javascript  by  Amo Chen  ‐ 1 min read

最近工作的過程偶然發現一個神奇的錯誤,覺得蠻值得紀錄成文章與大家分享的。

原因是有一段 Javascript 大致上長得像以下程式碼片段,但卻不管怎樣都會進 if 區塊:

if(response.statusCode == 200 && _.contains(['a', 'b']), response.status) {
    console.log(true);
}

後來發現是 _.contains(['a', 'b'], response.status) 被不小心寫成 _.contains(['a', 'b']), response.status 導致 if 條件內變成 Comma Operator ,導致連 ESlinter 也掃描不到錯誤,執行上也沒有任何問題,最後成為一個隱藏的 BUG 彩蛋。

這原因是因為 Comma Operator 會由左至右執行 , 分隔的每個運算,然後回傳最後一個運算結果:

var x = 1;
var y = (x + 1, x + 2, x + 3);
console.log(y);  // y === 4

因此 if(response.statusCode == 200 && _.contains(['a', 'b']), response.status) 變成直接只看 response.status 是不是 undefined 或者空字串來判斷要不要進 if 區塊,所有的謎題就此解開。

後話:

原本以為這是 Javascript 的特性,但沒想到 C 語言剛好也有一樣的 Comma Operator ,也算是藉由 BUG 認識一個有趣的知識。

FOLLOW US

對抗久坐職業傷害

研究指出每天增加 2 小時坐著的時間,會增加大腸癌、心臟疾病、肺癌的風險,也造成肩頸、腰背疼痛等常見問題。

然而對抗這些問題,卻只需要工作時定期休息跟伸展身體即可!

你想輕鬆改變現狀嗎?試試看我們的 PomodoRoll 番茄鐘吧! PomodoRoll 番茄鐘會根據你所設定的專注時間,定期建議你 1 項辦公族適用的伸展運動,幫助你打敗久坐所帶來的傷害!

贊助我們的創作

看完這篇文章了嗎? 休息一下,喝杯咖啡吧!

如果你覺得 MyApollo 有讓你獲得實用的資訊,希望能看到更多的技術分享,邀請你贊助我們一杯咖啡,讓我們有更多的動力與精力繼續提供高品質的文章,感謝你的支持!