方法鏈可以透過一連串的方法呼叫來取得計算結果,而無需將中間結果存為變數。
想像草莓果醬的生產線,上面包含幾個主要關卡:清洗、烹煮和裝瓶,經過一步步的處理,將新鮮草莓轉變為美味的果醬。生產線就像是方法鏈,而這些關卡則是草莓果醬的生產方法。這條生產線透過一連串的生產方法,將草莓加工成草莓果醬,就像方法鏈呼叫一連串的方法來得到最終結果一樣。
方法鏈是一個十分常見的技巧,透過連續調用同一對象的方法來進行一系列操作。讓我們用一個簡單的數學範例來展示方法鏈的設計方式。
MathChain
代表一個數學運算對象,能夠進行基本的加減乘除,你可以連續對目標數字進行運算,直到返回計算結果。
class MathChain {
private value: number;
constructor(initialValue: number) {
this.value = initialValue;
console.log(`Initial value: ${this.value}`);
}
add(n: number) {
this.value += n;
console.log(`Adding ${n}: ${this.value}`);
return this;
}
subtract(n: number) {
this.value -= n;
console.log(`Subtracting ${n}: ${this.value}`);
return this;
}
multiply(n: number) {
this.value *= n;
console.log(`Multiplying by ${n}: ${this.value}`);
return this;
}
divide(n: number) {
this.value /= n;
console.log(`Dividing by ${n}: ${this.value}`);
return this;
}
getValue() {
return this.value;
}
}
初始化一個運算方法鏈,依序執行加減乘除,再印出結果。
class MathChainTestDrive {
static main() {
const result = new MathChain(5)
.add(4)
.subtract(3)
.multiply(2)
.divide(1)
.getValue();
console.log(`Calculated result: ${result}`);
}
}
MathChainTestDrive.main();
執行結果:
Initial value: 5
Adding 4: 9
Subtracting 3: 6
Multiplying by 2: 12
Dividing by 1: 12
Final value: 12
Calculation result: 12
方法鏈是一種程式設計技巧,使對象可以在同一語句中連續調用多個方法。這種設計的特點是,每個方法都會返回原對象,以便接續更多的操作。這允許我們直接呼叫一連串的方法來取得最終結果,而不需要將中間結果儲存成一個個變數,使程式碼變得更簡潔且更具組織性。
方法鏈被廣泛應用於 JavaScript 的基本型別中,例如字串和陣列的操作方法,許多開源套件也用這種手法設計 API,像是 zod 和 RxJS。嚴格來說,方法鏈是一種程式設計技巧,而非一項正式的設計模式。然而,它十分實用也很容易上手,因此趁這個機會分享給大家。