目前 community 的主流跟我理出來的期望不一樣... 所以記錄一下。

先提一下背景，在 JavaScript 程式語言裡面，在大多數的情境下是可以省略掉分號 (;) 的，也就是說這兩種寫法都是合法的 JavaScript 語法：

console.log('Hello, world.')

console.log('Hello, world.');

這是因為在 ECMA-262 裡面有 ASI (Automatic Semicolon Insertion) 的設計：「Automatic Semicolon Insertion」。

ASI 設計本身是好的，可以讓開發者少處理 ;，但偏偏 EMCA-262 又允許千變萬化的換行，於是就造成了各種奇怪的現象。

因此早期在 community 上都是推薦無條件加上分號，這可以避免各種奇怪的 bug 與 error，像是「Do you recommend using semicolons after every statement in JavaScript?」以及「Should I use semicolons in JavaScript?」這些問答。

大家會推薦加上分號主要的原因是因為，不加上分號遇到的 error 與 bug 不是那種你知道很雷，所以會主動查詢 & 避開的問題：

而是各種平常寫就會遇到的情況，最容易中獎的是第二組敘述是 (、[ 開頭的，像是 ECMA-262 文件裡面提到的 case 就算常見了：

a = b + c
(d + e).print()

// 等價於：
a = b + c(d + e).print();

而且不因為註解受到影響：

// blahblah
a = b + c

// blahblah
(d + e).print()

// 還是等價於：
a = b + c(d + e).print();

另外一個常見的情況是我們會利用 anonymous function 包出一個 block，避免變數污染到外面：

// I want to do blahblahblah...
(() => {
  const a = '';
  // ...
})()

// I want to do another blahblahblah...
(() => {
  const a = '';
  // ...
})()

大多數的情況應該會 error，除非第一個 anonymous function 傳回一個 callable，而這種情況跑出來的結果就更慘了...

另外這種 case 也是常見的情況：

// ...
[1, 2, 3].forEach(...)

// ...
[4, 5, 6].forEach(...)

// 等價於：
[1, 2, 3].forEach(...)[4, 5, 6].forEach(...)

這邊省略分號最大的問題是你無法知道「自己這行需不需要加上分號」，因為註解可能很長有個 30 行，所以依照這些現況，比較好的方法應該是全部加上分號，保持一致性。

但這幾年所有的 frontend framework 都是推動拿掉分號，這可以從各家的文件看到，就搞不懂 community 是怎麼推導出來的... 在全部都拿掉分號的情況下，遇到上面的情況就得寫成不一致的 style：

// ...
[1, 2, 3].forEach(...);

// ...
[4, 5, 6].forEach(...)

查了目前可行的 workaround，大多都是透過 ESLint 類的工具來擋可能會出現 bug 的地方，也只能先這樣做了...

To respond on your own website, enter the URL of your response which should contain a link to this post's permalink URL. Your response will then appear (possibly after moderation) on this page. Want to update or remove your response? Update or delete your post and re-enter your post's URL again. (Learn More)