」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > JavaScript 函數式程式設計簡介:不同的 monad #11

JavaScript 函數式程式設計簡介:不同的 monad #11

發佈於2024-07-29
瀏覽:144

Introduction to Functional Programming in JavaScript: Different monads #11

Monad 是函數式程式設計中的一個基本概念,它提供了一種以結構化方式處理計算和資料轉換的方法。 monad 有多種類型,每種類型都旨在解決特定問題並處理不同類型的資料和效果。

什麼是 Monad?

單子是一種抽象,允許對包裝值進行連結操作。它由三個主要屬性定義:

  1. Unit(也稱為 of 或 return):接受一個值並將其包裝在 monad 中的函數。
  2. Bind(也稱為 flatMap 或 chain):一個函數,它接受一個 monadic 值和一個傳回 monad 的函數,將該函數應用於包裝的值,並傳回一個新的 monad。
  3. 關聯性:一元運算的組合應該是關聯性的。

Monad 的常見類型

  1. 也許是 Monad
  2. 任一 Monad
  3. Promise Monad
  4. 列表 Monad
  5. 閱讀器 Monad
  6. 作家莫納德
  7. 狀態 Monad

1.也許是莫納德

Maybe Monad 用於處理可選值。它表示可能失敗或傳回 null 或未定義的計算。

執行
class Maybe {
  constructor(value) {
    this.value = value;
  }

  static of(value) {
    return new Maybe(value);
  }

  isNothing() {
    return this.value === null || this.value === undefined;
  }

  map(fn) {
    return this.isNothing() ? this : Maybe.of(fn(this.value));
  }

  flatMap(fn) {
    return this.isNothing() ? this : fn(this.value);
  }
}

// Usage
const maybeValue = Maybe.of('hello')
  .map(str => str.toUpperCase())
  .flatMap(str => Maybe.of(`${str} WORLD`));
console.log(maybeValue); // Maybe { value: 'HELLO WORLD' }

2. 任一 Monad

Either Monad 用於處理可以傳回成功值(右)或錯誤值(左)的計算。

執行
class Either {
  constructor(value, isRight = true) {
    this.value = value;
    this.isRight = isRight;
  }

  static right(value) {
    return new Either(value, true);
  }

  static left(value) {
    return new Either(value, false);
  }

  map(fn) {
    return this.isRight ? Either.right(fn(this.value)) : this;
  }

  flatMap(fn) {
    return this.isRight ? fn(this.value) : this;
  }
}

// Usage
const rightValue = Either.right(5)
  .map(x => x   1)
  .flatMap(x => Either.right(x * 2));
console.log(rightValue); // Either { value: 12, isRight: true }

const leftValue = Either.left('error')
  .map(x => x   1)
  .flatMap(x => Either.right(x * 2));
console.log(leftValue); // Either { value: 'error', isRight: false }

3. 承諾單子

Promise Monad 用於處理非同步計算。

用法
const fetchData = url => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(`Data from ${url}`);
    }, 1000);
  });
};

// Usage
fetchData('https://api.example.com')
  .then(data => {
    console.log(data); // 'Data from https://api.example.com'
    return fetchData('https://api.example.com/2');
  })
  .then(data => {
    console.log(data); // 'Data from https://api.example.com/2'
  })
  .catch(error => {
    console.error(error);
  });

4. 列出單子

List Monad 用於處理生成值清單的計算。

執行
class List {
  constructor(values) {
    this.values = values;
  }

  static of(values) {
    return new List(values);
  }

  map(fn) {
    return List.of(this.values.map(fn));
  }

  flatMap(fn) {
    return List.of(this.values.flatMap(value => fn(value).values));
  }
}

// Usage
const list = List.of([1, 2, 3])
  .map(x => x   1)
  .flatMap(x => List.of([x, x * 2]));
console.log(list); // List { values: [ 2, 4, 3, 6, 4, 8 ] }

5. 讀者單子

Reader Monad 用於處理依賴某些共享環境或配置的計算。

執行
class Reader {
  constructor(fn) {
    this.fn = fn;
  }

  static of(value) {
    return new Reader(() => value);
  }

  map(fn) {
    return new Reader(env => fn(this.fn(env)));
  }

  flatMap(fn) {
    return new Reader(env => fn(this.fn(env)).fn(env));
  }

  run(env) {
    return this.fn(env);
  }
}

// Usage
const config = { baseURL: 'https://api.example.com' };

const fetchUser = new Reader(env => `${env.baseURL}/user`);
const fetchPosts = new Reader(env => `${env.baseURL}/posts`);

const fetchUserAndPosts = fetchUser.flatMap(userURL =>
  fetchPosts.map(postsURL => ({ userURL, postsURL }))
);

console.log(fetchUserAndPosts.run(config)); 
// { userURL: 'https://api.example.com/user', postsURL: 'https://api.example.com/posts' }

6.作家莫納德

Writer Monad 用於處理生成值以及日誌或附加資料的計算。

執行
class Writer {
  constructor(value, log) {
    this.value = value;
    this.log = log;
  }

  static of(value) {
    return new Writer(value, '');
  }

  map(fn) {
    const result = fn(this.value);
    return new Writer(result.value, this.log   result.log);
  }

  flatMap(fn) {
    const result = fn(this.value);
    return new Writer(result.value, this.log   result.log);
  }

  tell(log) {
    return new Writer(this.value, this.log   log);
  }
}

// Usage
const writer = Writer.of(3)
  .map(value => new Writer(value   1, 'Incremented\n'))
  .flatMap(value => new Writer(value * 2, 'Doubled\n'));

console.log(writer); 
// Writer { value: 8, log: 'Incremented\nDoubled\n' }

7. 狀態單子

State Monad 用於處理維護狀態的計算。

執行
class State {
  constructor(runState) {
    this.runState = runState;
  }

  static of(value) {
    return new State(state => [value, state]);
  }

  map(fn) {
    return new State(state => {
      const [value, newState] = this.runState(state);
      return [fn(value), newState];
    });
  }

  flatMap(fn) {
    return new State(state => {
      const [value, newState] = this.runState(state);
      return fn(value).runState(newState);
    });
  }

  run(initialState) {
    return this.runState(initialState);
  }
}

// Usage
const increment = new State(state => [state   1, state   1]);

const result = increment
  .flatMap(() => increment)
  .flatMap(() => increment)
  .run(0);

console.log(result); // [3, 3]

結論

Monad 提供了一種結構化且可預測的方式來處理函數式程式設計中的計算和資料轉換。每種類型的 monad 都有特定的用途,從使用 Maybe Monad 處理可選值到使用 Promise Monad 管理非同步操作。

版本聲明 本文轉載於:https://dev.to/francescoagati/introduction-to-functional-programming-in-javascript-different-monads-11-2je1?1如有侵犯,請聯絡[email protected]刪除
最新教學 更多>
  • 儘管程式碼有效,為什麼 POST 請求無法擷取 PHP 中的輸入?
    儘管程式碼有效,為什麼 POST 請求無法擷取 PHP 中的輸入?
    解決PHP 中的POST 請求故障在提供的程式碼片段:action=''而非:action="<?php echo $_SERVER['PHP_SELF'];?>";?>"檢查$_POST陣列:表單提交後使用 var_dump 檢查 $_POST 陣列的內容...
    程式設計 發佈於2024-12-18
  • 如何在 PHP 中組合兩個關聯數組,同時保留唯一 ID 並處理重複名稱?
    如何在 PHP 中組合兩個關聯數組,同時保留唯一 ID 並處理重複名稱?
    在 PHP 中組合關聯數組在 PHP 中,將兩個關聯數組組合成一個數組是常見任務。考慮以下請求:問題描述:提供的代碼定義了兩個關聯數組,$array1 和 $array2。目標是建立一個新陣列 $array3,它合併兩個陣列中的所有鍵值對。 此外,提供的陣列具有唯一的 ID,而名稱可能重疊。要求是建...
    程式設計 發佈於2024-12-18
  • Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta:列偏移的刪除和恢復Bootstrap 4 在其Beta 1 版本中引入了重大更改柱子偏移了。然而,隨著 Beta 2 的後續發布,這些變化已經逆轉。 從 offset-md-* 到 ml-auto在 Bootstrap 4 Beta 1 中, offset-md-*...
    程式設計 發佈於2024-12-18
  • 在 Go 中使用 WebSocket 進行即時通信
    在 Go 中使用 WebSocket 進行即時通信
    构建需要实时更新的应用程序(例如聊天应用程序、实时通知或协作工具)需要一种比传统 HTTP 更快、更具交互性的通信方法。这就是 WebSockets 发挥作用的地方!今天,我们将探讨如何在 Go 中使用 WebSocket,以便您可以向应用程序添加实时功能。 在这篇文章中,我们将介绍: WebSoc...
    程式設計 發佈於2024-12-18
  • 插入資料時如何修復「常規錯誤:2006 MySQL 伺服器已消失」?
    插入資料時如何修復「常規錯誤:2006 MySQL 伺服器已消失」?
    插入記錄時如何解決「一般錯誤:2006 MySQL 伺服器已消失」介紹:將資料插入MySQL 資料庫有時會導致錯誤「一般錯誤:2006 MySQL 伺服器已消失」。當與伺服器的連線遺失時會出現此錯誤,通常是由於 MySQL 配置中的兩個變數之一所致。 解決方案:解決此錯誤的關鍵是調整wait_tim...
    程式設計 發佈於2024-12-18
  • 大批
    大批
    方法是可以在物件上呼叫的 fns 數組是對象,因此它們在 JS 中也有方法。 slice(begin):將陣列的一部分提取到新數組中,而不改變原始數組。 let arr = ['a','b','c','d','e']; // Usecase: Extract till index ...
    程式設計 發佈於2024-12-18
  • CSS3 轉場是否提供事件來偵測起點和終點?
    CSS3 轉場是否提供事件來偵測起點和終點?
    了解 CSS3 過渡事件CSS3 過渡允許在 Web 元素上實現流暢的動畫和視覺效果。為了增強使用者體驗並使操作與這些轉換同步,監控其進度非常重要。本文解決了 CSS3 是否提供事件來檢查過渡何時開始或結束的問題。 W3C CSS 過渡草案W3C CSS 過渡草案規定CSS 轉換會觸發對應的 DOM...
    程式設計 發佈於2024-12-18
  • Java 中可以手動釋放記憶體嗎?
    Java 中可以手動釋放記憶體嗎?
    Java 中的手動內存釋放與垃圾回收與C 不同,Java 採用託管內存框架來處理內存分配和釋放由垃圾收集器(GC) 自動執行。這種自動化方法可以提高記憶體利用率並防止困擾 C 程式的記憶體洩漏。 Java 中可以手動釋放記憶體嗎? 由於 Java 的記憶體管理是由GC,它沒有提供像 C 中的 fre...
    程式設計 發佈於2024-12-18
  • Java 1.6 中如何可靠地確定檔案是否為符號連結?
    Java 1.6 中如何可靠地確定檔案是否為符號連結?
    在 Java 1.6 中驗證符號連結確定符號連結的存在對於各種文件處理操作至關重要。在 Java 中,識別符號連結時需要考慮一些潛在問題,特別是在目錄遍歷的上下文中。 檢查符號連結的常見方法是比較文件的絕對路徑和規範路徑。規範路徑表示檔案的標準化路徑,而絕對路徑可能包括符號連結。傳統上,概念是如果這...
    程式設計 發佈於2024-12-17
  • 如何使背景顏色透明,同時保持文字不透明?
    如何使背景顏色透明,同時保持文字不透明?
    背景顏色的不透明度而不影響文本在Web 開發領域,實現透明度通常對於增強視覺吸引力和網站元素的功能。常見的要求是對 div 背景套用透明度,同時保留所包含文字的不透明度。這可能會帶來挑戰,特別是在確保跨瀏覽器相容性方面。 rgba 解決方案最有效且廣泛支持的解決方案是利用「RGBA」(紅、綠、藍、A...
    程式設計 發佈於2024-12-17
  • PHP 字串比較:`==`、`===` 或 `strcmp()` – 您應該使用哪個運算子?
    PHP 字串比較:`==`、`===` 或 `strcmp()` – 您應該使用哪個運算子?
    PHP 中的字串比較:'=='、'===' 或 'strcmp()'? PHP 中的字串比較PHP 可以使用不同的運算子來完成,例如「==」、「===」或「strcmp()」函數。此比較涉及檢查兩個字串是否相等。 '==' 與'...
    程式設計 發佈於2024-12-17
  • 如何自訂操作列的按鈕和外觀?
    如何自訂操作列的按鈕和外觀?
    自訂操作欄的按鈕和外觀要實現所需的自訂操作欄外觀,請考慮以下步驟: 1.建立自訂操作按鈕若要將圖片包含為按鈕,請透過擴充Button類別來定義自訂視圖。然後可以將此自訂視圖顯示在 ActionBar 上,如下所示:<Button android:id="@ id/my_cus...
    程式設計 發佈於2024-12-17
  • 介紹 Laravel 的履歷解析器/CV 解析器
    介紹 Laravel 的履歷解析器/CV 解析器
    照片由 Mohammad Rahmani 在 Unsplash 上拍攝 基於我們的 Resume/CV Parsing AI API 端點的流行,我們專門為您製作了一個專門的輕量級 Laravel 庫。 招募的未來:敏銳、精確且對 Laravel 友好 這個新套件可在 github...
    程式設計 發佈於2024-12-17
  • 如何在 PHP 中重新格式化日期以方便使用者顯示?
    如何在 PHP 中重新格式化日期以方便使用者顯示?
    在PHP 中重新格式化日期使用資料庫中儲存的日期時,通常需要重新格式化它們以便於使用者友好的顯示。對於以「2009-08-12」等格式儲存的日期尤其如此,人類本質上無法讀取這種格式。 為了解決這個問題,PHP 提供了各種工具,使您能夠輕鬆重新格式化日期。一種有效的方法是使用 DateTime 類,它...
    程式設計 發佈於2024-12-17
  • 為什麼我無法將元素新增到具有通配符泛型類型(`?extends Parent`)的 Java 集合中?
    為什麼我無法將元素新增到具有通配符泛型類型(`?extends Parent`)的 Java 集合中?
    型安與通配符泛型:了解禁止修飾符在Java 使用泛型集合時,通配符泛型的概念可以引入某些最初看起來可能違反直覺的限制。一個典型的例子是無法在具有通配符泛型類型的 Java 集合中新增值。 考慮以下程式碼片段:List<? extends Parent> list = ...; Paren...
    程式設計 發佈於2024-12-17

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3