01.本章介绍
我们在导学课中提到过,这门课程分为上半部分和下半部分:
- 【上半部分】:在课程的上半部分,手写实现原始版本的React
这个版本的代码,不严格的对标React15,会有其他版本的功能,比如React16.8的Hooks,代码实现思路是和React15保持基本一致的,在学习的过程中,大家重点关注代码实现的思路,从宏观层面去整体理解React框架的一些特点和思想,不要在代码细节层面去深究我们编写的代码和原版本代码实现细节的区别,因为为了便于大家的学习,这一阶段中,我们具体的函数名称、变量名称都不会和原版源码保持一摸一样,而是根据实际情况进行了调整,但实现思路是一致的
- 【下半部分】:在课程的下半部分,我们高度还原实现React18核心功能
所谓高度还原,就是在实现React18核心功能的过程中,尽可能保证函数的名称和调用方式,以及代码目录结构,文件结构都保持一致,与原版本的React18相比,只会有功能上的取舍。举个例子,在实现事件合成系统的时候,我们可能只会实现一个‘click'事件的处理,但是原版本源码会处理很多个事件,代码量也很大,但无论原版本React18源码实现了多少个事件,其原理都和我们实现的那一个'click'事件的处理高度相似,所以不会在手写的源码中重复相似的功能。
现在我们就正式进入手写实现原始版本的React源码的内容。这个原始版本的代码会分为好几章来完成编写和讲解,本章的目标是完成初始化渲染的过程。
所谓初始化渲染的过程,我们可以直接对应到React程序中ReactDOM.render函数调用后的结果。(当然,在React18中初始化渲染的编写方式已经发生了变化,我们在这里暂时不用关心。即使大家不清楚ReactDOM.render的作用也不要紧,相信我们在编写代码的过程中会让大家清楚的理解)。