Redux的applyMiddleware的实现

Question

我的问题是为什么 middlewareAPI 不能使用 :

const middlewareAPI = {
  getState: store.getState,
  dispatch: dispatch
}

替换源码中的定义如下：

export default function applyMiddleware(...middlewares) {
  return (createStore) => (reducer, preloadedState, enhancer) => {
    const store = createStore(reducer, preloadedState, enhancer)
    let dispatch = store.dispatch
    let chain = []

    const middlewareAPI = {
      getState: store.getState,
      dispatch: (...args) => dispatch(...args)   // why not just use `dispatch: dispatch`
    }
    chain = middlewares.map(middleware => middleware(middlewareAPI))
    dispatch = compose(...chain)(store.dispatch)

    return {
      ...store,
      dispatch
    }
  }
}

谁能告诉我区别？谢谢

Answer 1

有点复杂的JS变量组合scoping/hosting，需要保证传入的dispatch方法实际指向中间件链的开始

请查看新增（尚未发布）Redux FAQ entry on why applyMiddleware uses a closure了解更多详情。

Redux的applyMiddleware的实现

The implementation of Redux's applyMiddleware

redux

redux-middleware