深入剖析redux原理 ,并自己手动实现,小伙又学会一项技能

话不多说 先说下redux流程 然后直接上代码
redux 主要是状态管理工具
在redux中想要修改状态 就需要去dispatch(action) 触发 reducer 根据action 的不同 返回不同状态的state
同时触发subscribe的注册的回调函数 获取最新的state状态,通过redux中的createStore api 即可实现上述功能 直接上代码了 代码中会有详细的注释 帮助大家理解 如果对大家有帮助,别忘了一键三连哦 !多谢多谢!

function createStore() {
  let state   //保存状态
  let listenes=[] // subscribe 可能有多个回调 ,该数组用于保存多个回调

//subscribe保存回调
function subscribe (callback) {
  listeners.push(callback)  //通过数组方法保存
}
//dispatch 触发回调
function dispatch (action){
  state =reducer(state,action)// 首先派发anction 调用reducer 返回新状态后再进行 subcribe回调函数的执行
  for (let i=0;i

这样一个简易的createStore qpi就实现了
上述其实是对createStore api的封装 其中集成了 redux的核心执行顺序 规则 以及返回值,相信大家看到这里都会对redux 有了新的认识

你可能感兴趣的:(javascript,react,native)