看文档不如看源码系列热身 - Redux 源码全解析

├── applyMiddleware.ts
├── bindActionCreators.ts
├── combineReducers.ts
├── compose.ts
├── createStore.ts
├── index.ts
├── types
│   ├── actions.ts
│   ├── middleware.ts
│   ├── reducers.ts
│   └── store.ts
└── utils
    ├── actionTypes.ts
    ├── formatProdErrorMessage.ts
    ├── isPlainObject.ts
    ├── kindOf.ts
    ├── symbol-observable.ts
    └── warning.ts
复制代码

export { createStore, combineReducers, bindActionCreators, applyMiddleware, compose, __DO_NOT_USE__ActionTypes };
复制代码

export default function createStore<S, A extends Action, Ext = {}, StateExt = never>(
    reducer: Reducer<S, A>,
    preloadedState?: PreloadedState<S>,
    enhancer?: StoreEnhancer<Ext, StateExt>
): Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;
复制代码

export type Reducer<S = any, A extends Action = AnyAction> = (state: S | undefined, action: A) => S;
复制代码

const store = {
    dispatch: dispatch as Dispatch<A>,
    subscribe,
    getState,
    replaceReducer,
    [$$observable]: observable
} as unknown as Store<ExtendState<S, StateExt>, A, StateExt, Ext> & Ext;
复制代码

let currentState = preloadedState as S;
复制代码

function getState(): S {
    if (isDispatching) {
        throw new Error('You may not call store.getState() while the reducer is executing.');
    }
    return currentState as S;
}
复制代码

function dispatch(action: A) {
    if (!isPlainObject(action)) {
        throw new Error(`Actions must be plain objects.`);
    }
    if (typeof action.type === 'undefined') {
        throw new Error('Actions may not have an undefined "type" property. ');
    }
    if (isDispatching) {
        throw new Error('Reducers may not dispatch actions.');
    }
    try {
        isDispatching = true;
        currentState = currentReducer(currentState, action);
    } finally {
        isDispatching = false;
    }
    const listeners = (currentListeners = nextListeners);
    for (let i = 0; i < listeners.length; i++) {
        const listener = listeners[i];
        listener();
    }
    return action;
}
复制代码

function subscribe(listener: () => void) {
    if (typeof listener !== 'function') {
        throw new Error(`Expected the listener to be a function. Instead, received: '${kindOf(listener)}'`);
    }
    if (isDispatching) {
        throw new Error('You may not call store.subscribe() while the reducer is executing. ');
    }
    let 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. ');
        }
        isSubscribed = false;
        ensureCanMutateNextListeners();
        const index = nextListeners.indexOf(listener);
        nextListeners.splice(index, 1);
        currentListeners = null;
    };
}
复制代码

function replaceReducer<NewState, NewActions extends A>(
    nextReducer: Reducer<NewState, NewActions>
): Store<ExtendState<NewState, StateExt>, NewActions, StateExt, Ext> & Ext {
    if (typeof nextReducer !== 'function') {
        throw new Error(`Expected the nextReducer to be a function. Instead, received: '${kindOf(nextReducer)}`);
    }
    (currentReducer as unknown as Reducer<NewState, NewActions>) = nextReducer;
    dispatch({ type: ActionTypes.REPLACE } as A);
    return store as unknown as Store<ExtendState<NewState, StateExt>, NewActions, StateExt, Ext> & Ext;
}
复制代码

export default function combineReducers<M extends ReducersMapObject>(
    reducers: M
): Reducer<CombinedState<StateFromReducersMapObject<M>>, ActionFromReducersMapObject<M>>;
复制代码

function combineReducers(reducers: ReducersMapObject) {
    const reducerKeys = Object.keys(reducers);
    const finalReducers: ReducersMapObject = {};
    for (let i = 0; i < reducerKeys.length; i++) {
        const key = reducerKeys[i];
        if (typeof reducers[key] === 'function') {
            finalReducers[key] = reducers[key];
        }
    }
    const finalReducerKeys = Object.keys(finalReducers);
    return function combination(state: StateFromReducersMapObject<typeof reducers> = {}, action: AnyAction) {
        let hasChanged = false;
        const nextState: StateFromReducersMapObject<typeof reducers> = {};
        for (let i = 0; i < finalReducerKeys.length; i++) {
            const key = finalReducerKeys[i];
            const reducer = finalReducers[key];
            const previousStateForKey = state[key];
            nextState[key] = nextStateForKey;
            hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
        }
        hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length;
        return hasChanged ? nextState : state;
    };
}
复制代码

return enhancer(createStore)(reducer, preloadedState as PreloadedState<S>) as Store<
    ExtendState<S, StateExt>,
    A,
    StateExt,
    Ext
> &
    Ext;
复制代码

export default function applyMiddleware(...middlewares: Middleware[]): StoreEnhancer<any> {
    return (createStore: StoreEnhancerStoreCreator) =>
        <S, A extends AnyAction>(reducer: Reducer<S, A>, preloadedState?: PreloadedState<S>) => {
            const store = createStore(reducer, preloadedState);
            let dispatch: Dispatch = () => {
                throw new Error('');
            };
            const middlewareAPI: MiddlewareAPI = {
                getState: store.getState,
                dispatch: (action, ...args) => dispatch(action, ...args)
            };
            const chain = middlewares.map(middleware => middleware(middlewareAPI));
            dispatch = compose<typeof dispatch>(...chain)(store.dispatch);
            return {
                ...store,
                dispatch
            };
        };
}
复制代码

function logger({ getState }) {
    return next => action => {
        console.log('will dispatch', action);
        const returnValue = next(action);
        console.log('state after dispatch', getState());
        return returnValue;
    };
}
const store = createStore(todos, ['Use Redux'], applyMiddleware(logger));
复制代码