5e228資訊網——每日最新資訊28at.com

JavaScript中的柯里化(Currying)和反柯里化(Uncurrying)是兩種很有用的技術，可以幫助我們寫出更加優雅、泛用的函數。本文將首先介紹柯里化和反柯里化的概念、實現原理和應用場景，通過大量的代碼示例幫助讀者深入理解這兩種技術的用途。5e228資訊網——每日最新資訊28at.com

JavaScript中的柯里化

概念

柯里化(Currying)是把接受多個參數的函數變換成接受一個單一參數(最初函數的第一個參數)的函數，并且返回接受余下的參數且返回結果的新函數的技術。這個技術由數學家Haskell Curry命名。5e228資訊網——每日最新資訊28at.com

簡單來說，柯里化可以將使用多個參數的函數轉換成一系列使用一個參數的函數。例如：5e228資訊網——每日最新資訊28at.com

function add(a, b) {  return a + b; }// 柯里化后function curriedAdd(a) {  return function(b) {    return a + b;  }}

實現原理

實現柯里化的關鍵是通過閉包保存函數參數。以下是柯里化函數的一般模式：5e228資訊網——每日最新資訊28at.com

function curry(fn) {  return function curried(...args) {    if (args.length >= fn.length) {      return fn.apply(this, args);    } else {      return function(...args2) {        return curried.apply(this, args.concat(args2));      }    }  }}

curry函數接受一個fn函數為參數，返回一個curried函數。curried函數檢查接收的參數個數args.length是否滿足fn函數需要的參數個數fn.length。如果滿足，則直接調用fn函數;如果不滿足，則繼續返回curried函數等待接收剩余參數。5e228資訊網——每日最新資訊28at.com

這樣通過閉包保存每次收到的參數，直到參數的總數達到fn需要的參數個數，然后將保存的參數全部 apply 給 fn執行。5e228資訊網——每日最新資訊28at.com

利用這個模式可以輕松將普通函數柯里化:5e228資訊網——每日最新資訊28at.com

// 普通函數function add(a, b) {  return a + b;} // 柯里化后let curriedAdd = curry(add); curriedAdd(1)(2); // 3

應用場景

參數復用

柯里化可以讓我們輕松復用參數。例如:5e228資訊網——每日最新資訊28at.com

function discounts(price, discount) {  return price * discount;}// 柯里化后const tenPercentDiscount = discounts(0.1); tenPercentDiscount(500); // 50tenPercentDiscount(200); // 20

提前返回函數副本

有時我們需要提前返回函數的副本給其他模塊使用,這時可以用柯里化。5e228資訊網——每日最新資訊28at.com

// 模塊Afunction ajax(type, url, data) {  // 發送ajax請求}// 柯里化后export const getJSON = curry(ajax)('GET');// 模塊Bimport { getJSON } from './moduleA'; getJSON('/users', {name: 'John'});

延遲執行

柯里化函數在調用時并不會立即執行，而是返回一個函數等待完整的參數后再執行。這讓我們可以更加靈活地控制函數的執行時機。5e228資訊網——每日最新資訊28at.com

let log = curry(console.log);log('Hello'); // 不會立即執行setTimeout(() => {  log('Hello'); // 2秒后執行}, 2000);

JavaScript中的反柯里化

概念

反柯里化(Uncurrying)與柯里化相反，它將一個接受單一參數的函數轉換成接受多個參數的函數。5e228資訊網——每日最新資訊28at.com

// 柯里化函數  function curriedAdd(a) {  return function(b) {    return a + b;  }}// 反柯里化后function uncurriedAdd(a, b) {  return a + b; }

實現原理

反柯里化的關鍵是通過遞歸不停調用函數并傳入參數，Until參數的數量達到函數需要的參數個數。5e228資訊網——每日最新資訊28at.com

function uncurry(fn) {  return function(...args) {    let context = this;    return args.reduce((acc, cur) => {      return acc.call(context, cur);     }, fn);  }}

uncurry 接收一個函數 fn，返回一個函數。這個函數利用reduce不停調用 fn 并傳入參數，Until 把args所有參數都傳給 fn。5e228資訊網——每日最新資訊28at.com

利用這個模式可以輕松實現反柯里化：5e228資訊網——每日最新資訊28at.com

const curriedAdd = a => b => a + b;const uncurriedAdd = uncurry(curriedAdd);uncurriedAdd(1, 2); // 3

應用場景

統一接口規范

有時我們會從其他模塊接收到一個柯里化的函數,但我們的接口需要一個普通的多參數函數。這時可以通過反柯里化來實現統一。5e228資訊網——每日最新資訊28at.com

// 模塊A導出export const curriedGetUser = id => callback => {  // 調用callback(user)};// 模塊B中import { curriedGetUser } from './moduleA';// 反柯里化以符合接口const getUser = uncurry(curriedGetUser); getUser(123, user => {  // use user});

提高參數靈活性

反柯里化可以讓我們以任意順序 passes 入參數,增加了函數的靈活性。5e228資訊網——每日最新資訊28at.com

const uncurriedLog = uncurry(console.log);uncurriedLog('a', 'b'); uncurriedLog('b', 'a'); // 參數順序靈活

支持默認參數

柯里化函數不容易實現默認參數，而反柯里化后可以方便地設置默認參數。5e228資訊網——每日最新資訊28at.com

function uncurriedRequest(url, method='GET', payload) {  // 請求邏輯}

大廠面試題解析

實現add(1)(2)(3)輸出6的函數

這是一道典型的柯里化面試題。解析：5e228資訊網——每日最新資訊28at.com

function curry(fn) {  return function curried(a) {    return function(b) {      return fn(a, b);    }  }}function add(a, b) {  return a + b;}const curriedAdd = curry(add);curriedAdd(1)(2)(3); // 6

利用柯里化技術，我們可以將普通的 add 函數轉化為 curriedAdd，它每次只接收一個參數，并返回函數等待下一個參數，從而實現了 add(1)(2)(3) 的效果。5e228資訊網——每日最新資訊28at.com

實現單參數compose函數

compose函數可以將多個函數合并成一個函數，這也是一道常見的柯里化面試題。解析：5e228資訊網——每日最新資訊28at.com

function compose(fn1) {  return function(fn2) {     return function(x) {      return fn1(fn2(x));    };  };}function double(x) {  return x * 2;}function square(x) {  return x * x;}const func = compose(double)(square);func(5); // 50

利用柯里化，我們創建了一個單參數的 compose 函數，它每次返回一個函數等待下一個函數參數。這樣最終實現了 compose(double)(square) 的效果。5e228資訊網——每日最新資訊28at.com

反柯里化Function.bind

Function.bind 函數實現了部分參數綁定，這本質上是一個反柯里化的過程。解析：5e228資訊網——每日最新資訊28at.com

Function.prototype.uncurriedBind = function(context) {  const fn = this;  return function(...args) {    return fn.call(context, ...args);  } }function greet(greeting, name) {  console.log(greeting, name);}const greetHello = greet.uncurriedBind('Hello');greetHello('John'); // Hello John

uncurriedBind 通過遞歸調用并傳參實現了反柯里化，使 bind 參數從兩步變成一步傳入，這也是 Function.bind 的工作原理。5e228資訊網——每日最新資訊28at.com

總結

柯里化和反柯里化都是非常有用的編程技巧，讓我們可以寫出更加靈活通用的函數。理解這兩種技術的實現原理可以幫助我們更好地運用它們。在編碼中，我們可以根據需要決定是將普通函數柯里化，還是將柯里化函數反柯里化。合理運用這兩種技術可以大大提高我們的編程效率。5e228資訊網——每日最新資訊28at.com

本文鏈接：http://www.www897cc.com/showinfo-26-125-0.html三言兩語說透柯里化和反柯里化

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。郵件：2376512515@qq.com

上一篇： 如何通過Python線程池實現異步編程？

下一篇： 如何使用JavaScript創建一只圖像放大鏡？