Redux 实现原理

[hsipeng]

function createStore(reducer, state = null){
    let listeners = [];
    let getState = () => state;
    let subscribe = listener => listeners.push(listener);
    let dispatch = (action) => {
        state = reducer(state, action);
        listeners.forEach(listener => listener());
    }
    return {
        getState,
        subscribe,
        dispatch
    }
}

const initialState = {
    couter: 0
}

function reduers(state, action){
    if(!state){
        return initialState
    }
    switch(action.type){
        case 'ADD':
            let num = state.couter
            num += action.num;
            return {
                ...state, 
                couter: num
            }
    }
}

const store = createStore(reduers, initialState)

store.subscribe(()=>{
    console.log(`当前state,${JSON.stringify(store.getState())}`)
})
store.dispatch({
    type: 'ADD',
    num: 1
})

store.dispatch({
    type: 'ADD',
    num: 1
})

store.dispatch({
    type: 'ADD',
    num: 1
})