Redux story-1:who creates it?
前言?这是一个系列文章,旨在分享在react及相关技术栈实践过程中的个人感悟,心得。如果有不好的地方,欢迎各位批评指正。 ?由于对react本身还未深入了解,今天我们先来谈一谈redux相关的问题。 Who creates it??Dan Abramov是 ?在我最初了解到他的时候,我觉得他非常有礼貌。同时,也为了更多的了解 ?如果你有兴趣的话,可以看看我摘录的一些片段。其中除了知识性的内容外,还有一些关于它自己生活,经历,学习方法,如何面对JS疲劳等等的摘录。也让我渐渐的了解到了国外的程序员们的一些观点,兴趣,梗等等。 正文?好了,暂时先介绍到这里了。切回redux本身,下面是学习源码过程中自己的一些体会。 createStore? ?且每个 ?因为在 ?另外,上面的提到的形如 ?这也是社区有那么多 ?所以在自己的 applyMiddleware? ?对于中间件而言,中间件的模板为: ?实际的调用顺序如下(定义在 1. middleware(middlewareAPI); /* var middlewareAPI = { getState: store.getState,dispatch: (action) => dispatch(action) }; chain = middlewares.map(middleware => middleware(middlewareAPI)); dispatch = compose(...chain)(store.dispatch); 第1步即为第1次执行中间件,用redux自己的dipatch初始化各个中间件里的dispatch(也就是中间件的next参数)和getState。 从而确保至少redux本身能够正常工作,中间件的store或者_ref即为这里的middlewareAPI * */ 2. dispatch = compose(...chain)(store.dispatch); /* 第2步即为第2次执行中间件 即用compose的形式链式调用第1步返回的中间件集合,如果中间件是定义在applyMiddleware的最后一个 那么中间件里的next为store.dispatch,否则next为上一个中间件返回的结果,可以理解为上一个中间件 返回的是封装了dispatch的自己的dispatch,这里的原理其实和enhancer一模一样 enhancer的目的是封装多次createStore并用compose的方式进行调用 middleware的目的是封装多次dispatch并用compose的方式进行调用 * */ 总结: /* 所以最后在redux的createStore.js中return的enhancer(createStore)(reducer,preloadedState)的结果就是一个增强 版的store,而这个增强版的store中存放的是增强版的dispatch * */ /* ××××××××××××××××关于combineReducers××××××××××××××× * 从执行上来说,combineReducers实际上最后就是变成对reducers进行深度优先遍历并执行的过程 * 从结构上来说,combineReducers决定了我们的state状态树的最终结构或者说形状,他是呈一个树型结构的 * combineReducers(reducerA,reducerB),reducerA里面嵌套combineReducers(reducerA-child1,reducerA-child2) * 实际上对应状态树而已就是第一层有两个节点A,B,而A节点下面有两个子节点A-child1,A-child2 * * 所以在最初设计的时候,我们要设想我们最终的状态树的样子,然后合理划分reducer,就像设计数据库的表结构一样。 当然这是比较概括的说法,事实上reducer的设计或者说state的划分有太多太多值得研究的东西,这个我们以后再谈了。 * */ bindActionCreator
function bindActionCreator(actionCreator,dispatch) { return (...args) => dispatch(actionCreator(...args)) } 所以我们可以一般在组件里直接调用 connect?既然提到了 ?传入 ?订阅就是告诉 结语?篇幅有限,这一篇文章暂时就先这样啦,更多的内容,我想放在下一篇来分享,同时自己也在不断学习,希望能理解得更好。 ?值得一提的是,我们也许会认为我们了解到的redux,mobx,rxjs等等完全不同理念的库,他们的作者也许也是"极端"的,是排斥他人及理念的。实际上,这是不正确的,早在16年5月,Dan就和mobx的作者在twitter上有过互动,他们达成了共识,那就是和对方一起合作,一起推动自身以及react的发展。 ?对于redux-thunk,文档中也许会首先建议使用这个简单的库来处理异步相关的问题。对于复杂的应用,他们也推荐使用redux-saga这样的库去重构自己的代码。在twitter上,Dan也多次提到过库的应用场景的问题,建议大家用之前先了解自己为什么要使用,它解决了哪些痛点,然后再去使用。甚至特意提过issue,来了解react-router-redux的作用。 ?除此之外,也提到在时间充裕的情况下,学习react,应该先从本身入手,ES6,webpack,jsx,redux等等和react本身都是没有直接联系的,在学习完react之后,我们知道了他本身的哪些不足,哪些地方需要加强,哪些地方需要引入第三方库去解决,解决的是哪些痛点,我们再去了解这些工具,才能真正体会到他们的威力。 ?说到这里,稍微有一点远了,不过我觉得还是有必要提及一下。那就是,我们身处一个浮躁的社会,无论是在现实中对待朋友,亲人,陌生人,由于学习,工作,生活的压力,周遭的浮躁氛围的影响,多多少少也会让自己带着些许暴戾之气。在网络上,由于约束的放宽,我们也许更会将压抑的情感释放给广袤的网络世界,在微博,贴吧,知乎上,我们或多或少书写着,察觉着这样的行为。 ?但是,作为一名程序猿,我还是期待能够看到我们这个圈子更多的将时间,精力,努力花费在对现有技术的改进,对未知世界的探索,追寻程序,库,框架,思想的本质,结交志同道合的朋友,一起交流,分享,思考对技术的看法。而不是卷入无休止的撕逼,用了某某而产生的优越,甚至借贬低他人来抬高自己。 ?我们可以理解一时的愤懑之情,因为我们大多,真是只是普普通通的社会人,喜怒哀乐再平常不过。但若我们一直保持这种状态,永远在上面这些场景都留下对人不对事的话语,讥讽,甚至谩骂。希望大家能为我们的后代想想。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |