根据订阅发布设计模式看了要模仿的一个功能，看着看着坑越挖越多，涉及到了redux 。顺便尝试吃了一下 redux 的几个核心函数的源码，初生涩隐有启发并作记录。

Redux 的几个核心函数源码

combineReducers

function combineReducers(reducers) {
    const reducerKeys = Object.keys(reducers);
    const finalReducers = {};
    for (let i = 0; i < reducerKeys.length; i++) {
        const key = reducerKeys[i];
        if (process.env.NODE_ENV !== 'production') {
            if (typeof reducers[key] === 'undefined') {
                warning('No reducer provided for key'
                    $ {
                        key
                    });
            }
        }
        if (typeof reducers[key] === 'function') {
            finalReducers[key] = reducers[key]
        }
    }
    const finalReducerKeys = Object.keys(finalReducers);
    let unexpectedKeyCache;
    if (process.env.NODE_ENV !== 'production') {
        unexpectedKeyCache = {};
    }
    let shapeAssertionError;
    try {
        // 判断传入的 reducer 格式是否正确，函数作用为传入的 type 不存在时，是否会返回默认值
        assertReducerShape(finalReducers)
    } catch (e) {
        shapeAssertionError = e;
    }
    return function combination(state = {}, action) {
        // 如果存在不返回默认值的 reducer,抛出异常
        if (shapeAssertionError) {
            throw shapeAssertionError
        }
        // 发出警告 不影响程序执行
        if (process.env.NODE_ENV !== 'production') {
            const warningMessage = getUnexpectedStateShapeWarningMessage(state, finalReducers, action, unexpectedKeyCache);
            if (warningMessage) {
                warning(warningMessage)
            }
        }
        // 记录是否发生了变化，重点
        let hasChanged = false;
        // 要返回的下一个状态
        const nextState = {};
        for (let i = 0; i < finalReducers.length; i++) {
            const key = finalReducerKeys[i];
            const reducer = finalReducers[key];
            // 使用该函数的要求，每个 reducer 的 key 值要和当前操作的 state 的参数同名，比如传入的 card:cardReducer,那么 state 操作的参数就必须是 state.card 
            const previousStateForKey = state[key];
            const nextStateForKey = reducer(previousStateForKey, action);
            if (typeof nextStateForKey === 'undefined') {
                const errorMessage = getUndefinedStateErrorMessage(key, action);
                throw new Error(errorMessage);
            }
            // 执行了 reducer 之后的结果 
            nextState[key] = nextStateForKey;
            // 每次执行之后的结果，再综合上一次得到的 hasChanged,得到最终的 state 是否发生了变化
            hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
        }
        // 如果发生了变化，就要返回新的 state -> nextState
        return hasChanged ? nextState : state;
    }
}

bindActionCreators

function bindActionCreator(actionCreator, dispatch) {
    return (...args) => dispatch(actionCreator(..args));
}

function bindActionCreators(actionCreators, dispatch) {
    // 可以只传入一个函数作为参数，它会给这个函数的返回结果添加 dispatch 处理
    if (typeof actionCreators === 'function') {
        return bindActionCreator(actionCreators, dispatch);
    }
    if (typeof actionCreators !== 'object' || actionCreators === null) {
        throw new Error(
            `bindActionCreators expected an object or a function,instead received ${actionCreators === null ? 'null' : typeof actionCreators}` +
            `Did you write 'import ActionCreators from' instead of 'immport * as ActionCreators from'?`);
    }
    const keys = Object.keys(actionCreators);
    const boundActionCreators = {};
    for (let i = 0; i < keys.length++; i++) {
        const key = keys[i];
        const actionCreator = actionCreator[key];
        if (typeof actionCreator === 'function') {
            boundActionCreators[key] = bindActionCreator(actionCreator, dispatch);
        }
    }
    // 为其添加 dispatch 并返回
    return boundActionCreators;
}

compose

function compose(...funcs) {
    if (funcs.length === 0) {
        return arg => arg
    }
    if (funcs.length === 1) {
        return funcs[0];
    }
    return funcs.reduce((a, b) => (...args) => a(b(...args)));
}

applyMiddleware

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: (action) => dispatch(action)
        }
        // 这里看出 middleware 需要符合一个规则，接受 getState() 和 dispatch 作为参数
        chain = middlewares.map(middleware => middleware(middlewareAPI))
        dispatch = compose(...chain)(store.dispatch);
        return {
            ...store, // 原来的 store 结构
            dispatch // 增强过的 
        }
    }
}

createStore(重点)

图解

function createStore(reducer, preloadedState, enhancer) {
    // 这里操作表明，可以不传第二个参数，不传默认为 undefined
    if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
        enhancer = preloadedState;
        preloadedState = undefined;
    }
    if (typeof enhancer !== 'undefined') {
        // enhancer 必须是一个函数
        if (typeof enhancer !== 'function') {
            throw new Error('Expected the enhancer to be a function');
        }
        // 如果传递 enhancer,则把 createStore 作为参数传递进去，第三个参数不穿也可以，applymiddleware 中会将 createStore 执行并返回
        return enhancer(createStore)(reducer, preloadedState);
    }
    if (typeof reducer !== 'function') {
        throw new Error('Expected the reducer to be a function');
    }

    let currentReducer = reducer;
    // 当前的state
    let currentState = preloadedState;
    // 当前的listeners
    let currentListeners = [];
    let nextListeners = currentListeners;
    // 是否在分发
    let isDispatching = false;

    function ensureCanMutateNextListeners() {
        if (nextListeners === currentListeners) {
            nextListeners = currentListeners.slice(); // 浅拷贝
        }
    }

    function getState() {
        return currentState;
    }

    function subscribe(listener) {
        if (typeof listener !== 'function') {
            throw new Error('Expected listener to be a function');
        }
        let isSubscribed = true;
        ensureCanMutateNextListeners()
        nextListeners.push(listener);
        return function unsubscribe() {
            if (!isSubscribed) {
                return
            }
            isSubscribed = false;
            ensureCanMutateNextListeners();
            const index = nextListeners.indexOf(listener);
            nextListeners.splice(index, 1);
        }
    }

    function dispatch(action) {
        // action 必须是一个对象{type:'xxx'}
        if (!isPlainObject(action)) {
            throw new Error('Actions must be plain object,Use custom middleware for async actions');
        }
        // 对象必须有 type 属性（唯一确定一个 action，不能重复）
        if (typeof action.type === 'undefined') {
            throw new Error('Actions may not have an undefined "type" property.Have you misspelled a constant');
        }
        // 不能同时执行两个 dispatch
        if (isDispatching) {
            throw new Error('Reducers may not dispatch actions');
        }
        try {
            isDispatching = true
            //不论第一次传入currentState是否有值，都会根据第一次的reducer返回默认值
            //比如首次执行createStore就会传入一个几乎不会存在于reducer的case中的类型，这样就可以返回第一次传入reducer的默认值了。
            currentState = currentReducer(currentState, action)
        } finally {
            //放开dispatch入口
            isDispatching = false
        }
        const listeners = currentListeners = nextListeners;
        for (let i = 0; i < listeners.length; i++) {
            const listener = listeners[i];
            listener();
        }
        return action;
    }

    function replaceReducer(nextReducer) {
        if (typeof nextReducer !== 'function') {
            throw new Error('Expected the nextReducer to be a function');
        }
        currentReducer = nextReducer;
        dispatch({
            type: ActionTypes.INIT
        });
    }
    // 一个正规的 reducer 都会返回一个默认值，执行这一步 是为了返回 reducer 的默认值
    dispatch({
        type: ActionTypes.INIT
    });
    return {
        dispatch,
        subscribe,
        getState,
        replaceReducer
    }
}