詞匯表

這是有關(guān)Redux中的一些核心概念的詞匯表，以及他們的類型簽名。這些類型使用了 流標(biāo)注法進(jìn)行記錄。

State

type State = any;

State (也叫 state tree) 是一個寬泛的概念，但是在 Redux API 中它通常與被 store 所管理的，可以被 getState() 返回的，單獨(dú) state 值相關(guān)。 它表示了一個 Redux應(yīng)用的全部狀態(tài)，通常為一個多層嵌套的對象。

約定俗成，頂層 state 為一個對象，或幾個像 Map 那樣的鍵-值集合，當(dāng)然是任意類型的話也成。當(dāng)然，你仍然可以盡可能保持狀態(tài)的串行化。不要把什么都放進(jìn)去導(dǎo)致無法容易地轉(zhuǎn)換成 JSON。

Action

type Action = Object;

Action 是一個用以表示要改變的 state 的意圖的普通對象。Action 是將數(shù)據(jù)拿到 store 里的唯一方法。無論是 UI 事件，網(wǎng)絡(luò)回調(diào)，還是其他諸如 WebSocket 之類的其他源，任何數(shù)據(jù)都或多或少的被 dispatch 成 action。

約定俗成，action 應(yīng)該有一個 type 域指明了需要被演算的 action 類型。Type 可以被定義為常數(shù)從其他 module 中導(dǎo)入。比起用 Symbols 表示 type 使用 String 是更好的方法因?yàn)?string 是可被串行化的。

除了 type之外，action 對象的結(jié)構(gòu)其實(shí)完全取決于你自己。如果你感興趣的話，請參考 Flux Standard Action 作為如何組織 actions 的建議。

還有就是請看后面的 異步 action。

Reducer

type Reducer<S, A> = (state: S, action: A) => S;

Reducer (也叫 reducing function) 是一個接受累積運(yùn)算和一個值，返回新的累積函數(shù)的函數(shù)。用來把一個集合 reduce 到一個單獨(dú)值。

Reducer 并不是 Redux 特有的——它是函數(shù)式編程中的一個基本概念。甚至大部分的非函數(shù)式語言比如 JavaScript，都有一個內(nèi)建的 reduce API。在 JavaScript 中的話是 Array.prototype.reduce().

在 Redux 中，累計運(yùn)算的結(jié)果是個 state 對象，被累積的值就是 action。Reducer 由上一個 state 和一個 action 計算得到一個新 state。它必須是 純函數(shù) 也就是由完全相同的輸入會返回完全相同的輸出。它應(yīng)該是沒有副作用的。這使得一些很棒的功能諸如熱重載和時間旅行成為可能。

Reducer 是 Redux 之中最重要的概念。

不要在 reducer 中有 API 調(diào)用

dispatch function

type BaseDispatch = (a: Action) => Action;
type Dispatch = (a: Action | AsyncAction) => any;

一個 dispatching function (或者簡單點(diǎn)叫 dispatch function) 是一個接收一個 action 或者異步 action的函數(shù)，它可以或不可以分發(fā)一個或多個 action 到 store。

我們必須搞清 dispatch function 和由沒有 middleware 的 store 實(shí)例提供的 base dispatch function 其中的區(qū)別。

Base dispatch function 總是 同步發(fā) action 給 store 的 reducer，以及由 store 返回的上一個 state 計算出新 state。它期望 actions 會是一個準(zhǔn)備好被 reducer 消費(fèi)掉的普通對象。

Middleware 封裝了base dispatch function。它允許了 dispatch function 處理 action 之外的 異步 action。 middleware 可以被變形，延遲，忽略，以及其他在將 action 或異步 action 傳遞給下一個 middleware 之前作出解釋。獲取更多信息請往后看。

Action Creator

type ActionCreator = (...args: any) => Action | AsyncAction;

Action Creator 很簡單，就是一個創(chuàng)建 action 的函數(shù)。別把這兩個概念搞混。Action 是一個信息的負(fù)載，而 action 創(chuàng)建者是一個創(chuàng)建 action 的工廠。

調(diào)用 action creator 只會生產(chǎn)出 action，但不分發(fā)。你需要調(diào)用 store 的 dispatch function 才會真正引起變化。有時我們講 bound action creator 意味著函數(shù)調(diào)用 action creator并立即將結(jié)果分發(fā)給一個特定的 store 實(shí)例。

如果 action 創(chuàng)建者需要讀取當(dāng)前狀態(tài)、做出 API 調(diào)用、或引起諸如路由變位等副作用，應(yīng)該返回一個 異步 action 而不是 action。

異步 Action

type AsyncAction = any;

異步 action 是一個發(fā)給分發(fā)函數(shù)，但還沒有準(zhǔn)備好被 reducer 消費(fèi)的值。它會在被發(fā)往 base dispatch() function 之前，被 middleware 變?yōu)橐粋€或一組 action。異步 actions 可以有多個 type，取決于使用的 middleware。通常為 Promise 或者 thunk 之類的異步原生，雖然沒有被馬上傳給 reducer，但是操作一旦完成就會觸發(fā) action 分發(fā)。

Middleware

type MiddlewareAPI = { dispatch: Dispatch, getState: () => State };
type Middleware = (api: MiddlewareAPI) => (next: Dispatch) => Dispatch;

Middleware 是一個高階函數(shù)，它將 dispatch function 組合并返回一個新的 dispatch function。它通常將 異步 actions 變?yōu)?actions。

Middleware 是使用了復(fù)合函數(shù)的可構(gòu)建的。它可在 action 日志，表現(xiàn)副作用例如路由，或?qū)惒?API 調(diào)用變?yōu)橐唤M同步 actions。

請見 applyMiddleware(...middlewares) 獲取有關(guān) middleware 的詳細(xì)內(nèi)容。

Store

type Store = {
  dispatch: Dispatch;
  getState: () => State;
  subscribe: (listener: () => void) => () => void;
  getReducer: () => Reducer;
  replaceReducer: (reducer: Reducer) => void;
};

Store 是一個承載有應(yīng)用 state tree 的對象。一個 Redux 應(yīng)用中應(yīng)當(dāng)只有一個 Store，因?yàn)闃?gòu)建發(fā)生于 reducer 級。

• dispatch(action) 是上面描述過的 base dispatch function。
• getState() 返回當(dāng)前 store 的 state。
• subscribe(listener) 注冊 funtion 用于在 state 改變時調(diào)用。
• getReducer() 和 replaceReducer(nextReducer) 可被用于實(shí)現(xiàn)熱重載荷代碼分割。通常你用不上他們。

請見完整的 store API reference 獲取更多細(xì)節(jié)。

Store Creator

type StoreCreator = (reducer: Reducer, initialState: ?State) => Store;

Store creator 是一個創(chuàng)建 Redux store 的函數(shù)。就像 dispatching function 那樣，我們必須分清由 createStore(reducer, initialState) 從 Redux 包中導(dǎo)出的 base store creator，和從 store enhancer 返回的 store creator。

Store enhancer

type StoreEnhancer = (next: StoreCreator) => StoreCreator;

Store enhancer 是一個高階函數(shù),將 store creator 組合，返回一個新的強(qiáng)化過的 store creator。這與允許你使用可組合方式變更 store 接口的 middleware 有點(diǎn)相似。

Store enhancer 是與 React 中概念非常相同的高階 component， 通常也會被叫做 “component enhancers”。

因?yàn)?store 并非一個實(shí)例，而更像是幾個函數(shù)的集合普通對象。復(fù)制可以被簡單的創(chuàng)建或修改而不需變動原先的 store。在 compose 文檔中有一個示例演示了這種做法。

大多數(shù)時候你不可能去寫 store enhancer，但你會用得著 developer tools 提供的。它使得app對其發(fā)生無察覺的時間旅行變得可能。搞笑的是，Redux middleware 的實(shí)現(xiàn) 本身就是一個 store enhancer。