JavaScript - Currying：初學者的指南

你好，有抱負的程序员們！今天，我們將踏上一段令人興奮的旅程，進入JavaScript的世界，並探討一個名為“柯里化（Currying）”的概念。別擔心如果你從未聽過它——我們將從基礎開始，逐步深入。在本教程結束時，你將能像專家一樣柯里化函數！

JavaScript - Currying

何為柯里化？

在我們深入如何操作的細節之前，讓我們先了解什麼是柯里化。柯里化是功能性編程中的一種技術，我們將一個接受多個參數的函數轉換為一個函數序列，每個函數只接受一個參數。

想像你正在做三明治。而不是一次性將所有食材放在一起，柯里化就像是逐個添加食材，一步一步地來。這給你更多控制和管理“函數三明治”的靈活性。

在JavaScript中如何實現柯里化

現在，讓我們看看如何在JavaScript中實現柯里化。我們將探討兩種主要方法：使用閉包和使用bind()方法。

使用閉包進行柯里化

閉包在JavaScript中就像神奇的盒子，記住了它們被創建的環境。我們可以使用這種超能力來創建柯里化函數。讓我們從一個簡單的例子開始：

function curry(f) {
return function(a) {
return function(b) {
return f(a, b);
};
};
}

function sum(a, b) {
return a + b;
}

let curriedSum = curry(sum);

console.log(curriedSum(2)(3)); // 輸出：5

在這個例子中，curry是一個高階函數，它接受另一個函數f作為參數。它返回一個新函數，該函數接受第一個參數a，然後返回另一個接受第二個參數b的函數。最後，它使用兩個參數調用原始函數f。

讓我們一步一步分解：

我們定義了一個curry函數，它將我們的常规函數轉換為柯里化函數。
我們有一個簡單的sum函數，用於將兩個數字相加。
我們通過將sum傳遞給我們的curry函數來創建一個curriedSum。
當我們調用curriedSum(2)(3)時，其實是這樣操作的：

curriedSum(2)返回一個函數，記住了2作為第一個參數。
我們立即使用(3)調用這個返回的函數，完成了操作。

酷炫吧？就像我們一點一滴地組建我們的函數調用！

使用bind()方法進行柯里化

JavaScript還提供了一個內置方法叫做bind()，我們可以用於柯里化。bind()方法創建一個新函數，當調用時，其this關鍵字被設定為提供的值，並且在調用新函數之前，有一系列的參數。

讓我們看看如何使用bind()進行柯里化：

function multiply(x, y) {
return x * y;
}

let multiplyByTwo = multiply.bind(this, 2);
console.log(multiplyByTwo(4)); // 輸出：8

let multiplyByThree = multiply.bind(this, 3);
console.log(multiplyByThree(4)); // 輸出：12

在這個例子中：

我們從一個簡單的multiply函數開始，它接受兩個參數。
我們使用bind()創建一個新函數multiplyByTwo。2被預設為第一個參數。
當我們調用multiplyByTwo(4)時，它實際上是調用multiply(2, 4)。
我們以同樣的方式創建multiplyByThree，將3作為第一個參數預設。

bind()方法讓我們可以“固定”函數的某些參數，創建一個具有這些參數已經設定的新函數。

柯里化的應用場景

現在我們了解了如何柯里化函數，讓我們探討一下為什麼我們可能想要這樣做。柯里化在JavaScript中有幾個實際應用：

函數合成：柯里化使得函數合成更容易，其中一個函數的輸出成為另一個函數的輸入。
部分應用：我們可以從更通用的函數中創建專門的函數，如我們的multiplyByTwo例子。
避免重複：當你發現自己反覆調用一個帶有相同參數的函數時，柯里化可以幫助減少重複。
事件處理：在前端開發中，柯里化對於處理帶有附加參數的事件非常有用。

讓我們看一個使用柯里化進行事件處理的現實世界例子：

function handleClick(message, event) {
console.log(message, event.target);
}

let button = document.getElementById('myButton');
button.addEventListener('click', handleClick.bind(null, 'Button clicked:'));

在這個例子中，我們使用柯里化來向事件處理器傳遞附加參數。當按鈕被點擊時，它將打印"Button clicked:"，後跟事件目標。

JavaScript中的柯里化方法

這裡是一個總結我們討論過的JavaScript中柯里化方法的表格：

方法	描述	示例
閉包	使用嵌套函數創建柯里化函數	`function curry(f) { return function(a) { return function(b) { return f(a, b); }; }; }`
bind()	使用bind()方法預設參數	`let multiplyByTwo = multiply.bind(this, 2);`

結論

恭喜你！你剛剛踏入了JavaScript中柯里化的世界。記住，就像學習任何新的編程概念一樣，實踐是關鍵。嘗試創建你自己的柯里化函數，並嘗試不同的應用場景。

柯里化可能一開始看起來有點抽象，但隨著你更多地使用它，你將開始看到它是如何讓你的代碼更靈活和可重用的。就像學習使用你編程工具箱中的新工具一樣——起初它可能會讓你感覺不適應，但很快你就會想知道沒有它你如何編寫代碼！

持續編碼，持續學習，最重要的是，玩得開心！JavaScript是一個充滿可能的遊樂場，而柯里化只是等待你去探索的許多令人興奮的功能之一。

Credits: Image by storyset