對saga學習筆記

wizChen 發布于2019-08-26 10:26 / 3537人閱讀

摘要：在調用函數時傳入了的監聽入口，一個函數將傳入執行一次獲得該函數的迭代器，將和其他參數，，，，傳入并執行。調用傳入的函數，如果執行結果為的話執行如果為迭代器的話，執行生成一個子進程否則直接調用將執行結果傳入。

1.生成saga中間件

a.通過sagaMiddlewareFactory工廠函數生成sagaMiddleware并將之返回
b.在生成中間件時默認情況下，context為{}, channel是由stdChannel函數生成, sagaMonitor為空
c.生成中間件就是redux的中間件，用戶dispatch時會先經過中間件，在saga中間件會先調用其他中間件（通過next(action)）,之后執行channel.put(action)來通知信道中處于監聽狀態的effect執行。

2.stdChannel生成標準信道

a.此函數內部調用的是同文件的multicastChannel函數，只是將生成的chan的put方法進行了二次封裝。
b.multicastChannel（多播信道）內部維護currentTakers和nextTakers共同指向的一個任務隊列。
    b1.multicastChannel函數返回一個對象，對象中包含put、take、close三個用于操作內部隊列的函數和一個MULTICAST為true的標識符。
    b2.take函數用于將callback函數（任務）放入任務隊列中，并給callback函數函數綁定[MATCH]屬性(默認都是() => ()=> true )和cancel方法（從隊列中移除該callback函數）
    b3.put函數將任務隊列中（take放入的callback）任務循環執行，輸入為dispatch的action
    b4.close函數，循環執行，與put類似，只是輸入為 { type: CHANNEL_END_TYPE }

3.sagaMiddleware.run

a.內部調用的boundRunSaga函數，該函數為生成saga中間件是聲明的，而這個函數是將runSaga函數綁定(context, channel, dispatch, getState, sagaMonitor, options)參數得。
    a1.在調用runSaga函數時傳入了effects的監聽入口，saga（一個generate函數）;將傳入saga執行一次獲得該函數的迭代器iterator，將iterator和其他參數（channel， getState， sagaMonitor，dispatch，finalizeRunEffect）傳入proc并執行proc。
        注意：dispatch是通過wrapSagaDispatch包裹redux的dispatch得到的（給調用時傳入的action綁定了SAGA_ACTION變量，值為{ value: true }）；finalizeRunEffect = v => v
    a2.將runEffect賦值給finalRunEffect函數，調用newTask創建一個主任務（內部維護一個任務的queue并有addTask等方法），調用一次next方法后，將task返回
    a3.next方法為傳入的迭代器的自動執行函數，根據傳入參數執行不同操作，無參數直接執行iterator的next函數，如返回的done為false，則執行digestEffect函數， 如果done為true則調用mainTask的cont函數。
    a4.digestEffect將傳入的cb（上面的next）函數包裝（所有cb函數都只能實行一次，再次執行時發現已經執行完成則直接返回），調用finalRunEffect（默認為runEffect）函數。
    a5.runEffect判斷傳入的effect（next中執行迭代器后result.value）類型,如果是promise則調用resolvePromise（effect, currCb）；如果為迭代器iterator（說明執行的也是個generator函數）則調用proc穿件一個子任務進程，如果為effect（含有[IO]屬性）則根據effect的type從effectRunnerMap中映射出對應的執行函數并執行，執行時把（env, effect.payload, currCb（只執行一次的上面的next）, executingContext（包含task和digestEffect））傳入。
b.effectRunnerMap:
    b1.select: runSelectEffect, 直接調用傳入的getState并通過傳入select映射出需要的屬性。
    b2.take: runTakeEffect, 調用傳入channel的take方法將傳入cb放入channel信道中。
    b3.put: runPutEffect, 封裝一個根據是否傳入channel判斷調用channel.put或redux的dispatch的函數放入調度asp()隊列，并將整個asp隊列中任務全部執行。
    b4.call: runCallEffect, 調用傳入的fn函數，如果fn執行結果為promise的話執行resolvePromise；如果為迭代器iterator的話，執行proc生成一個子進程；否則直接調用cb將執行結果傳入。

4.其他:

a.matchers是用來配置之后dispatch的action的。

GPU云服務器云服務器學習筆記學習筆記一基礎學習筆記深度學習筆記

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/106165.html

Redux 進階 - react 全家桶學習筆記（二）

摘要：在函數式編程中，異步操作修改全局變量等與函數外部環境發生的交互叫做副作用通常認為這些操作是邪惡骯臟的，并且也是導致的源頭。注：這篇是17年1月的文章，搬運自本人 blog... https://github.com/BuptStEve/... 零、前言在上一篇中介紹了 Redux 的各項基礎 api。接著一步一步地介紹如何與 React 進行結合，并從引入過程中遇到的各個痛點引出 ...

Godtoy 2019-08-23 10:58 評論0 收藏0
redux-saga框架使用詳解及Demo教程

摘要：通過創建將所有的異步操作邏輯收集在一個地方集中處理，可以用來代替中間件。 redux-saga框架使用詳解及Demo教程前面我們講解過redux框架和dva框架的基本使用，因為dva框架中effects模塊設計到了redux-saga中的知識點，可能有的同學們會用dva框架，但是對redux-saga又不是很熟悉，今天我們就來簡單的講解下saga框架的主要API和如何配合redux框...

Nosee 2019-08-23 11:49 評論0 收藏0
精益 React 學習指南（Lean React）- 3.4 掌控 redux 異步

摘要：舉例來說一個異步的請求場景，可以如下實現任何異步的邏輯都可以，如等等也可以使用的和。實際上在中，一個就是一個函數。書籍完整目錄 3.4 redux 異步 showImg(https://segmentfault.com/img/bVyou8); 在大多數的前端業務場景中，需要和后端產生異步交互，在本節中，將詳細講解 redux 中的異步方案以及一些異步第三方組件，內容有： redu...

JouyPub 2019-08-19 18:36 評論0 收藏0
精益 React 學習指南（Lean React）- 3.5 compose redux saga

摘要：通過可以實現很多有趣的簡潔的控制。這里默認使用到了的一個特性，如果某一個任務成功了過后，其他任務都會被。組合是的內關鍵字，使用的場景是一個。書籍完整目錄 3.5 compose redux sages showImg(https://segmentfault.com/img/bVyoVa); 基于 redux-thunk 的實現特性，可以做到基于 promise 和遞歸的組合編排，而...

Joyven 2019-08-19 18:36 評論0 收藏0