理解redux中介軟體

1. reducers 函式如何建立和聚合

2. action建立函式如何如何包裹在dispatch函式中

3. 如何給預設的dispatch方法增加中介軟體能力

（js context）中介軟體由函式組合的形式建立,實現與主要執行任務正交的功能。

tips：類似的有裝飾器模式

在 redux middleware 要裝飾的主要功能是 dispatch 函式。dispatch 函式的主要功能是傳送actions 給

reducer函式來產生新的state。

1. 函式組合

f(x) = 2x 

g(x) = x^2+3x+1

(f * g)(x) = f(g(x)) = f(2x) = 4x^2 + 6x + 1

組合兩個或者更多的函式，返回乙個新的函式

function compose(f,g)

從裡向外求值

2. 柯里化（curring）

通過柯里化，可以建立乙個擁有部分資訊的新函式

（bind some information）

function curring(a)

通過函式組合和柯里化能夠為資料處理建立乙個管道

redux midddleware 被設計用來在daispatch呼叫之前建立組合在一起的函式。

對dispatch的過程做包裝，不改變任何值。

1 export default

function
2return createstore => (...args) =>
1011 const middlewareapi =
15 const chain = middlewares.map(middleware =>middleware(middlewareapi))
16 dispatch =compose(...chain)(store.dispatch)
17//
dispatch is the new 
18return22}
23}2425
//dispatch in createstore 
26//
dispatch action and run the listener callback
27function
dispatch(action) finally
3435 const listeners = (currentlisteners =nextlisteners)
36for (let i = 0; i < listeners.length; i++) 
4041
return
action42}
4344
45//
46//
return a store which dispatch is decorated
47enhance(createstore)(reducer,preloadstate)
4849
//example looger middleware
50function logger()=>=>$`)
56//
dosomething
57return
returnnext58}
59 }

參考：

理解redux的中介軟體

export default function middlewares 註冊中介軟體呼叫鏈，並由此可知，所有的中介軟體最外層函式接收的引數都是 chain middlewares.map middleware middleware middlewareapi dispatch compose cha...

深入理解redux中介軟體

摘自 please call me hr redux middleware 是 redux 的乙個 advanced feature.這個概念並不是很新奇,以為在 koa 裡面早已經實現過了.對比與原生的redux middleware koa 的 middleware 差不多相當於是爸爸級的 le...

redux 中介軟體 redux thunk

什麼是中介軟體？中介軟體指的是redux的，不是react的。中間指的是action跟store之間，也就是對dispacth方的封裝，最原始的是直接將接受過來的物件直接傳遞給store，但是如果傳遞的是乙個函式的話，就不會將這直接傳遞給store，而是先執行這個函式。常見的中間有 redux de...