javascript 终极版，101.js

Posted 2021-05-04

import { createStore } from 'redux';

// Action Generators
const incrementCount = ({ incrementBy = 1 } = {}) => ({
  type: 'INCREMENT',
  incrementBy
});

const decrementCount = ({ decrementBy = 1 } = {}) => ({
  type: 'DECREMENT',
  decrementBy
});

const setCount = ({ count }) => ({
  type: 'SET',
  count
});

const resetCount = () => ({
  type: 'RESET'
});

// Reducers
// 1. Reducers are PURE functions
// 2. NEVER change state or action arguments, create new ones

const countReducer = (state = { count: 0 }, action) => {
  switch (action.type) {
    case 'INCREMENT':    
      return { count: state.count + action.incrementBy };
      
    case 'DECREMENT':
      return { count: state.count - action.decrementBy };

    case 'SET':
      return { count: action.count }

    case 'RESET':
      return { count: 0 };

    default:
      return state;
  }
};

// Store
const store = createStore(countReducer);

// Create Subscriber
const unsubscribe = store.subscribe(() => {
  console.log(store.getState());
});
// unsubscribe();

// Dispatch Events
store.dispatch(setCount({ count: 100 }));
store.dispatch(decrementCount());
store.dispatch(decrementCount({ decrementBy: 9 }));
store.dispatch(resetCount());