redux 学习总结

redux 总结

redux 是一个新型的前端架构模式，可以和任何前端库相结合使用。

• 简单描述redux模式的使用
  当我们在写一个共享状态的代码时，如果可以被任意修改的话，那么程序的行为将会不可预料，所以我们通过dispatch（中间人）来执行某些允许的修改操作，而且在action里面声明，让大家都知道数据被修改了。

• 抽象createStore
  经过上面的操作后，我们吧这个模式抽象出一个createSore，他可以产生store，里面包含getState和dispatch函数，方便我们使用。

• 加入订阅者模式
  后来我们发现每次数据都需要手动重新渲染，我们希望自动重新渲染页面，后来加入了订阅者模式，可以通过store.subscribe订阅数据修改事件，每次数据更新的时候都会自动重新渲染。

• 性能优化
  为了解决一些性能问题，我们引入“共享结构的对象”，这样可以在每一个渲染函数的开头进行简单的判断避免没有被修改的数据被重新渲染。

• redcer
  我们优化了 stateChanger 为 reducer，定义了 reducer 只能是纯函数，功能就是负责初始 state，和根据 state 和 action 计算具有共享结构的新的 state。

• createStore基本代码结构

  // 定一个 reducer
  function reducer (state, action) {
    /* 初始化 state 和 switch case */
  }
  
  // 生成 store
  const store = createStore(reducer)
  
  // 监听数据变化重新渲染页面
  store.subscribe(() => renderApp(store.getState()))
  
  // 首次渲染页面
  renderApp(store.getState()) 
  
  // 后面可以随意 dispatch 了，页面自动更新
  store.dispatch(...)
  

• 学习总结
  自己跟着教程总结了一下redux，模式的基本思想算是有一个概念了，但是使用还是不是很清楚，还很老火，所以还得继续努力。