1.js

const {
  createStore
} = Redux

const counter = (state = 0, action) => {
  switch (action.type) {
    case 'increment':
      return state + 1
    case 'decrement':
      return state - 2
    default:
      return state
  }
}

const store = createStore(counter)
const render = () => document.body.innerText = store.getState()
store.subscribe(render)
render()

document.addEventListener('click', () => {
  store.dispatch({
    type: 'increment'
  })
})

2.js

const createStore = (reducer) => {
  let handlers = []
  let state = reducer(state, {})
  const getState = () => state
  const dispatch = action => {
    state = reducer(state, action)
    handlers.forEach(handler => handler())
  }
  const subscribe = handler => {
    handlers.push(handler)
    return function unsubscribe() {
      const index = handlers.indexOf(handler)
      handlers = handlers.splice(index - 1, 1)
    }
  }
  return {
    getState,
    dispatch,
    subscribe
  }
}

const counter = (state = 0, action) => {
  switch (action.type) {
    case 'increment':
      return state + 1
    case 'decrement':
      return state - 1
    default:
      return state
  }
}

const store = createStore(counter)
const render = () => document.body.innerText = store.getState()
const unsubscribe = store.subscribe(function() {
  render()
})
const unsubscribe1 = store.subscribe(function() {
  alert(store.getState())
  unsubscribe1()
})
render()

document.addEventListener('click', () => {
  store.dispatch({
    type: 'increment'
  })
})

3.js

const todo = (state, action) => {
  switch (action.type) {
    case 'create_todo':
      return {
        id: action.id,
        text: action.text,
        completed: false
      }
    case 'toggle_todo_completed':
      if (state.id !== action.id) {
        return state
      }
      return {
        ...state,
        completed: !state.completed
      }
    default:
      return state
  }
}

const todos = (state = [], action) => {
  switch (action.type) {
    case 'create_todo':
      return [
        ...state,
        todo(undefined, action)
      ]
    case 'toggle_todo_completed':
      console.log('state', state)
      return state.map(t => todo(t, action))
    default:
      return state
  }
}

const visibilityFilter = (state = 'show_all', action) => {
  switch (action.type) {
    case 'set_visibility_filter':
      return action.filter
    default:
      return state
  }
}

const {
  createStore,
  // combineReducers
} = Redux

function combineReducers(reducers) {
  return (state = {}, action) => {
    Object.keys(reducers).forEach(key => {
      state[key] = reducers[key](state[key], action)
    })
    return state
  }
}

const todoApp = combineReducers({
  todos: todos,
  visibilityFilter: visibilityFilter
})

// const todoApp = (state = {}, action) => {
//   return {
//     todos: todos(state.todos, action),
//     visibilityFilter: visibilityFilter(state.visibilityFilter, action)
//   }
// }

const store = createStore(todoApp)

store.dispatch({
  type: 'create_todo',
  id: 1,
  text: 'foo'
})
store.dispatch({
  type: 'toggle_todo_completed',
  id: 1
})

console.log(store.getState())