遇到複雜、難讀的表達式時，引入一個有描述性名稱的區域變數，把它的意圖說出來。名字就是就地的註解——讀者不必逆向推導這段運算在算什麼。
🧠 Why It's a Problem
一長串運算式把「怎麼算」全塞在一行，卻不告訴你「這是什麼」。提取變數用一個好名字替子計算命名，讓表達式讀起來像它的意義本身。
- 表達式難懂：無法一眼看出這段運算式的意義。
- 語意清晰：你想傳達某個子計算的意圖，讓名字替你說話。
- 潛在重用：之後可能還會用到這段計算的一部分，先給它名字。
TIP
如果需要在表達式旁邊寫一行註解解釋它，那句註解通常就是變數名。命名比註解更耐用——它不會和程式碼失去同步。
⚖️ Refactoring
機械步驟：① 確認要提取的表達式沒有副作用 → ② 宣告一個不可變的變數、用「意圖」命名，把表達式指給它 → ③ 用這個變數取代原本的表達式 → ④ 測試。
前 — 一整串運算擠在一行
console.log((85 * 10) / 5 + 20);讀者得先在腦中算出 (85 * 10) / 5，才知道後面 + 20 是加在什麼上。
後 — 用具名變數說出意圖
const baseCalculation = (85 * 10) / 5;
const result = baseCalculation + 20;
console.log(result);子計算有了名字，整段運算的結構一眼可見，後續要重用 baseCalculation 也很自然。
NOTE
若這段計算屬於某個類別、又值得被別處共用，可以更進一步用 Replace Temp with Query 把變數升級成方法。反向則是 Inline Variable，把過度命名的暫存變數收回。
🔑 Takeaways
- Extract Variable 的本質是替一段運算式命名，把「怎麼算」翻譯成「這是什麼」。
- 觸發訊號：表達式難懂、想傳達子計算意圖、之後可能重用。
- 名字是就地、會跟著程式碼走的註解，比旁註更可靠。
- 需要跨函式共用同一計算時，考慮進一步 Replace Temp with Query。
No notes yet — jot your takeaways or Q&A here.