Redux源码解析一 createStore.js

本文主要是介绍Redux源码解析一 createStore.js，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

createStore.js 代码

createStore是一个方法，可以看到有三个参数

reducer：action处理函数reducer

preloadedState：初始状态state

enhancer：增强器函数，也就是我们说的中间件函数

首先是三个if判断，可以看到reducer必须是函数，preloadedState必须非函数，如果preloadedState是函数，那么第二个if判断（44行）会把它赋值给enhancer。第三个if判断（49行）执行增强器函数。

 if (typeof enhancer !== 'undefined') {
    if (typeof enhancer !== 'function') {
      throw new Error(
        `Expected the enhancer to be a function. Instead, received: '${kindOf(
          enhancer
        )}'`
      )
    }

    return enhancer(createStore)(reducer, preloadedState)
  }

1 处理中间件函数

这里直接 return enhancer(createStore)(reducer, preloadedState)

enhancer是一个高阶函数，入参是createStore方法本省，这是一个剥洋葱模型，把函数返回结果当作下一个函数的入参，然后一步一步走下去，到最后之后，其实会执行createStore(reducer, preloadedState)，然后再一步一步返回，最后执行58行的返回执行完毕。

2 执行 dispatch

可以看到createStore函数内部就只执行了dispatch方法之后就返回了。

dispatch({ type: ActionTypes.INIT })

dispatch方法会传入一个默认的action{type: ActionTypes.INIT}

ActionTypes.INIT是一个随机生成的字符串，具体方法自己去看，我们继续往下看。

action必须是一个对象，执行currentState = currentReducer(currentState, action) （218行）currentReducer就是createStore的入参reducer，

这篇关于Redux源码解析一 createStore.js的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

Javascript