react - redux 源码解读

redux的所有源码文件如下截图

在index.js 我们可以看到redux总共暴露的接口有以下这些

1. createStore
2. combineReducers
3. bindActionCreators
4. applyMiddleware
5. compose
6. __DO_NOT_USE__ActionTypes

createStore函数

入参介绍

1. reducer: 函数参数是当前的值currentState和要处理的操作action
2. preloadedState: 初始化state
3. enhancer: store拓展，redux自动applyMiddleware api可用于拓展store(更像是拓展dispatch)

返回值对象属性

1. dispatch：发送action的函数
2. subscribe：订阅一个函数监听，在react-redux connect中使用到，配合dispatch函数实现发布订阅模型
3. getState: 读取store的值api
4. replaceReducer：替换reducer函数，执行该函数会发出一个ActionTypes.REPLACE的action
5. [$$observable]: observable 配置observable对象实现观察者模型

combineReducers

• 合并reducers函数，返回值就是合并之后的reducer

1. 这个函数会过滤掉入参reducers中不是函数的的值, 见下源码
   
2. 该函数还会判断reducer函数，执行初始化action和一个随机action的时候是否会返回undefined，为undefined时执行会抛出异常，具体代码见下图
   
3. 开发环境执行函数还会调用 getUnexpectedStateShapeWarningMessage 检测 state和reducers是否有key冲突，初始化state是不是为对象，是否有reducers，action的type是否为ActionTypes.INIT，具体见
   

bindActionCreators

• 通过闭包，把 dispatch 和 actionCreator 隐藏起来，让其他地方感知不到 redux 的存在
  把我们的action生成函数类似于下面代码

function increment() {
  return {
    type: 'INCREMENT'
  }
}
function add(count) {
  return {
    type: 'ADD',
    count: count
  }
}

const actions = {
  function increment() {
	  return {
	    type: 'INCREMENT'
	  }
	},
  function add(count) {
	  return {
	    type: 'ADD',
	    count: count
	  }
	}
}

执行 bindActionCreators（actions, dispatch）
输出 actions = {
    increment: (...args) => dispatch(
	    (function increment() {
		  return {
		    type: 'INCREMENT'
		  }
		})(...args)
	),
    add: (count) => dispatch(
	    (function add(count) {
		  return {
		    type: 'ADD',
		    count: count
		  }
		})(count)
	)
}

applyMiddleware

使用方法

const store = createStore(
  reducer,
  applyMiddleware(...middleware)
)

主要作用，对dispatch功能加强或者说增加函数处理，也就是增加中间件。

• 例如简单的redux-thunk中间件

const thunk = ({ dispatch, getState }) => (next) => (action) => {
   if (typeof action === 'function') {
     return action(dispatch, getState);
   }
   return next(action);
 };

compose

一个工具函数用于生成一个组合一系列函数从右到左的执行

__DO_NOT_USE__ActionTypes

一些不能使用的action类型

未完待续。。。