原文:手写一个Redux,深入理解其原理

Redux可是一个大名鼎鼎的库,很多地方都在用,我也用了几年了,今天这篇文章就是自己来实现一个Redux,以便于深入理解他的原理。我们还是老套路,从基本的用法入手,然后自己实现一个Redux来替代源码的NPM包,但是功能保持不变。本文只会实现Redux的核心库,跟其他库的配合使用,比如React Redux准备后面单独写一篇文章来讲。有时候我们过于关注使用,只记住了各种使用方式,反而忽略了他们的核 ...

2020-07-03 14:03 1 1214 推荐指数:

查看详情

手写React的Fiber架构,深入理解原理

熟悉React的朋友都知道,React支持jsx语法,我们可以直接将HTML代码写到JS中间,然后渲染到页面上,我们的HTML如果有更新的话,React还有虚拟DOM的对比,只更新变化的部分,而不重新渲染整个页面,大大提高渲染效率。到了16.x,React更是使用了一个被称为Fiber的架构 ...

Wed Jun 24 01:29:00 CST 2020 1 2803
手写koa-static源码,深入理解静态服务器原理

这篇文章继续前面的Koa源码系列,这个系列已经有两篇文章了: 第一篇讲解了Koa的核心架构和源码:手写Koa.js源码 第二篇讲解了@koa/router的架构和源码:手写@koa/router源码 本文会接着讲一个常用的中间件----koa-static,这个中间件是用来搭建 ...

Mon Dec 07 19:50:00 CST 2020 0 543
深入理解Redux

前面的话   Redux是Flux思想的另一种实现方式。Flux是和React同时面世的。React用来替代jQuery,Flux用来替换Backbone.js等MVC框架。在MVC的世界里,React相当于V(view)的部分,只涉及页面的渲染。一旦涉及应用的数据管理部分,还是交给Model ...

Tue Apr 17 16:40:00 CST 2018 1 1253
JavaScript深入理解系列:bind方法详解以及手写

定义 由定义可知,函数调用bind()方法的时候,会返回一个新函数,并且this指向bind函数的第一个参数,简单来表示。 fn.bind(obj对象)执行 返回一个函数,想调用的时候,fn.bind(obj)()这样来执行; 举个例子: 总结: 第1步:模拟返回一个函数 ...

Fri Apr 15 00:25:00 CST 2022 0 808
手写Redux-Saga源码

上一篇文章我们分析了Redux-Thunk的源码,可以看到他的代码非常简单,只是让dispatch可以处理函数类型的action,其作者也承认对于复杂场景,Redux-Thunk并不适用,还推荐了Redux-Saga来处理复杂副作用。本文要讲的就是Redux-Saga,这个也是我在实际工作 ...

Mon Oct 19 23:20:00 CST 2020 0 434
手写一个React-Redux,玩转React的Context API

上一篇文章我们手写一个Redux,但是单纯的Redux只是一个状态机,是没有UI呈现的,所以一般我们使用的时候都会配合一个UI库,比如在React中使用Redux就会用到React-Redux这个库。这个库的作用是将Redux的状态机和React的UI呈现绑定在一起,当你dispatch ...

Thu Jul 09 18:29:00 CST 2020 0 578
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM