最初打开源码看我是非常迷茫的,不知道该从哪里看起,不知道如何看,后来经过一番折腾终于找到了自己看react源码的思路,分享出来供参考。
一般看一个开源项目,我会在package.json
中找到main
字段,从而找到入口,再顺藤摸瓜去看,但是react
的源码的package.json
中并没有main
字段。所以通过这样找入口的方式行不通。
既然找不到入口那就从熟悉的看,打开packages
目录,发现其中有个react
目录和react-dom
目录是自己比较熟悉的,猜想平时所用的import React from 'react'
以及import ReactDOM from 'react-dom'
应该就是分别导入的这两个目录下边的东西。初看代码发现确实是这样的,在react
目录可以找到PureComponent
,Component,createRef
等常用的东西,在react-dom
中也找到了render
方法。
找到了该看什么接下来是确定如何看,我尝试过去用项目里边配好的单元测试工具jest去跑代码打断点,但是后来发现并没有这种必要,一方面效率不高,另一方面只要分析的没有太大问题都会按预期走,没有必要都验证。所以后面都是直接看代码不去跑代码验证了。
总结下看react源码的思路。
1.从熟悉的看,熟悉的往往也是比较重要的。
2.不必跑代码验证,跑代码会打断思路,而且效率比较低。
3.挑重要的看,比如Component,ReactElement,render方法等,比较新的像hooks就可以先不看。
4.不必纠结细节,有些看不懂的地方可以先跳过。
更多web前端学习知识,请查阅 HTML中文网 !!
以上就是怎么看react源码?看react源码的思路介绍的详细内容,更多请关注0133技术站其它相关文章!