以查詢取代暫存變數 (Replace Temp with Query)

★★★★★Draft

FromRefactoring

📚 From the Books

以查詢取代暫存變數 (Replace Temp with Query)Refactoring Moves

暫存變數很方便:存住一個算出來的值、又用名字解釋它的意義。但改成函式常常更好——少一個要傳的參數、在邏輯與原函式間畫下明確邊界,還能避免同一段計算在相似函式裡重複出現。

🧠 Why It's a Problem

一個只被算一次、之後純粹被讀取的暫存變數,其實可以升級成一個查詢方法。這個手法在類別裡最有效,因為成員共用同一個環境,方法能直接取用它們。

WARNING

只適合「被計算一次、之後皆為讀取」的暫存變數,不適合快照(snapshot)變數——那種存的是某個時間點的狀態,改成每次重算意義就變了。

⚖️ Refactoring

機械步驟:① 確認變數在使用前已完全算定、且計算每次都給相同結果 → ② 把計算式抽成一個方法(查詢) → ③ 把對變數的引用改成呼叫該方法 → ④ 測試 → ⑤ 移除原本的暫存變數。

前 — 一串暫存變數承載中間計算
const originalPrice = 200;
const discountRate = 0.15;
const discountAmount = originalPrice * discountRate;
const discountedPrice = originalPrice - discountAmount;
console.log(`Discounted price: ${discountedPrice}`);

discountAmountdiscountedPrice 是散落的暫存變數,計算邏輯無法被其他地方共用。

後 — 暫存變數升級成查詢方法
class PriceCalculator {
  constructor(originalPrice, discountRate) {
    this.originalPrice = originalPrice;
    this.discountRate = discountRate;
  }

  discountAmount() {
    return this.originalPrice * this.discountRate;
  }

  discountedPrice() {
    return this.originalPrice - this.discountAmount();
  }
}

const calculator = new PriceCalculator(200, 0.15);
console.log(`Discounted price: ${calculator.discountedPrice()}`);

計算搬進共用環境的方法裡,discountedPrice() 直接呼叫 discountAmount()——邏輯有了明確邊界,也可被類別內其他方法重用。

NOTE

若只是想在單一函式內把難懂的表達式命名清楚,用 Extract Variable 就夠了;當這段計算值得跨方法共用、且屬於某個類別時,才升級成查詢。

🔑 Takeaways

✍️ My Notes

No notes yet — jot your takeaways or Q&A here.

📖 Further Reading