1. 程式人生 > >JS 程式碼中到底加不加分號

JS 程式碼中到底加不加分號

背景

在寫自動執行函式時

vm.$watch('datas', function() {
    console.log(vm.datas);
})
(function () {
    console.log('test');
})()

出現莫名錯誤:

Uncaught TypeError: vm.$watch(…)(…) is not a function

解決方法:

vm.$watch('datas', function() {
    console.log(vm.datas);
);
(function () {
    console.log('test');
})()

一個分號搞定。

自此,又引出 JavaScript 程式碼中要不要加分號的經典話題

分號

在 C 語言中,分號是語句結束的標誌,在語句結束的地方一定要以分號結束。而 JavaScript 的分號卻是可選的,若語句都各佔一行,則可以省略分號。

ASI 機制(Automatic semicolon insertion)

JavaScript 中的 ASI 機制,允許我們省略分號。ASI 機制不是說在解析過程中解析器自動把分號新增到程式碼中,而是說解析器除了分號還會以換行為基礎按一定的規則作為斷句的依據,從而保證解析的正確性。

ASI 規則

  • 新行併入當前行構成非法語句時,自動插入分號
  • continue, return, break, throw 後自動插入分號

    return => return;
    a+b a+b;

  • ++, -- 字尾表示式作為新行開始,會在行首自動插入分號
  • 程式碼塊的最後一個語句會自動插入分號

注意

  • 新行以 ( [ / + - * % , . 開始,很容易與上一行未加分號的程式碼成整體而一起解析,這明顯不是我們想要的結果

結論

為增強程式碼可讀性,減少歧義,個人意見是在語句結束時加上分號

PS:

  • 不要將 ++-- 放在同一行
  • 如果 return 後有引數,不要將引數放在獨立的行
  • 不要將括號的開始放在新的一行,理由為上一條

參考資料

[1] JavaScript 中的自動分號插入(ASI), http://justjavac.com/javascript/2013/04/22/automatic-semicolon-insertion-in-javascript.html,2016-4-13
[2] JavaScript 權威指南, 機械工業出版社, 2012
[3] JS魔法堂:ASI(自動分號插入機制)和前置分號, http://www.2cto.com/kf/201412/359884.html, 2016-4-13