Redux源码createStore解读常用方法
传入参数
- reducer,reducer行为函数
- preloadedState,初始化state数据
- enhancer,使用(中间件等),不常用
const store = createStore(reducer, [preloadedState], enhancer);
getState
直接返回当前currentState,获取state值,@return state(我觉得应该深克隆一个新的对象返回,不然有可能会被外部修改)
function getState() {
if (isDispatching) {
throw new Error('....');
}
// console.log(currentState);
return currentState;
}
dispatch派发行为
执行派发行为,就会在内部执行reducer并且执行之前准备发布的函数listener ,@params action行为,@return action行为
function dispatch(action) {
if (!isPlainObject(action)) {
throw new Error('Actions must be plain objects. ' + 'Use custom middleware for async actions.');
}
if (typeof action.type === 'undefined') {
throw new Error('Actions may not have an undefined "type" property. ' + 'Have you misspelled a constant?');
}
if (isDispatching) {
throw new Error('Reducers may not dispatch actions.');
}
try {
isDispatching = true;
currentState = currentReducer(currentState, action);
//执行reducer函数,会在创建的时候dispatch把刚开始的preloadedState传进来执行
} finally {
isDispatching = false;
}
var listeners = currentListeners = nextListeners;
for (var i = 0; i < listeners.length; i++) {
var listener = listeners[i];
listener();//发布订阅
}
return action;
}
subscribe函数
redux发布订阅
- 传入参数时@params function
- 并用闭包保存数据,最后可以删除,@return function unsubscribe
function subscribe(listener) {
if (typeof listener !== 'function') {//判断s listener是否函数
throw new Error('Expected the listener to be a function.');
}
if (isDispatching) {//判断是否派发
throw new Error('You may not call store.subscribe() while the reducer is executing. ' + 'If you would like to be notified after the store has been updated, subscribe from a ' + 'component and invoke store.getState() in the callback to access the latest state. ' + 'See https://redux.js.org/api-reference/store#subscribelistener for more details.');
}
var isSubscribed = true;
ensureCanMutateNextListeners();
nextListeners.push(listener);//把函数压入栈
return function unsubscribe() {
if (!isSubscribed) {
return;
}
if (isDispatching) {
throw new Error('You may not unsubscribe from a store listener while the reducer is executing. ' + 'See https://redux.js.org/api-reference/store#subscribelistener for more details.');
}
isSubscribed = false;
ensureCanMutateNextListeners();
var index = nextListeners.indexOf(listener);
nextListeners.splice(index, 1);
//删除数组里面的函数,如果连续删除容易造成数组塌陷
currentListeners = null;
};
}
如果有错,望大佬指出。。。