我的最佳實務：JavaScript

1. 停用快取

Firefox：
開啟開發者工具 -> 開啟設定 (F1) -> 「停用 HTTP 快取（開啟工具箱時）」

Chrome：
開啟開發人員工具 -> 開啟設定 (F1) -> "Disable cache (while DevTools is open)"

2. 讓 JS 主控台保持開啟

在開發者工具中開啟「主控台」分頁並一直開著，這樣第 1 步的設定才會持續生效，你也能及時發現網路和 JS 方面的錯誤。

另外推薦這個外掛，它能把 JS 錯誤顯示得更醒目，就算你自己偶爾忘了看主控台也沒關係：

3. JavaScript：必讀《你不知道的 JavaScript》（You Don't Know JS）

• You Don't Know JS (1st Edition)
• 解釋為什麼應該避免使用 this
• 解釋為什麼 JS 有時會發生看似奇怪的事（關鍵字：語彙範疇、閉包）

4. 分號

• 一律要加
• 雖然不是必要的，但它能幫你避開像這樣的陷阱：Stack Overflow
• JavaScript 會自動插入分號：

// you want to return 5 and have ugly formatting:
return
5

// JavaScript Interpretation:
return;
5;

5. 邏輯運算子 && 與 ||

• 在 Java 中，a && b 和 a || b 依照布林代數求值。a 和 b 必須是布林值。
• 在 JavaScript 中：
  • 對於 a && b，如果 a 為 true，就回傳 b
  • 對於 a || b，如果 a 為 false，就回傳 b

運算式也可以這樣串接起來，寫出史上最短的 if 陳述式，也就是一種語法糖：

• isAdmin && showDeleteButton();
• （嚴格來說，這已經不算陳述式了）

這種寫法也常用來設定預設值：

• let sendNewsletter = form.getNewsletterOptIn() || false;

6. JavaScript 是傳參考還是傳值？

JavaScript 在這一點上很有意思。例如：

function changeStuff(a, b, c) {
    a = a * 10;
    b.item = "changed";
    c = {item: "changed"};
}

var num = 10;
var obj1 = {item: "unchanged"};
var obj2 = {item: "unchanged"};

changeStuff(num, obj1, obj2);

console.log(num);
console.log(obj1.item);
console.log(obj2.item);

輸出如下：

10
changed
unchanged

如果 obj1 根本不是參考，那麼修改 obj1.item 對函式外部的 obj1 不會有任何影響。

如果參數是真正的參考，那麼所有值都會改變：num 會變成 100，obj2.item 會變成「changed」。然而實際上，num 仍然是 10，obj2.item 仍然是「unchanged」。

實際上，傳入的元素是以傳值方式傳遞的。只不過，被傳遞的這個值本身就是一個參考。在技術上，這稱為共享傳遞（call-by-sharing）。

實務上這代表：如果你修改參數本身（如 num 和 obj2），不會影響傳入函式的原始物件。但如果你修改參數內部的值，這些修改就會保留下來（如 obj1）。