一、一个真正的react组件编译后长啥样？ 我们瞎几把解读了react 虚拟dom对象是怎么生成的，生成了一个什么样的解构。一个react组件不光由若干个这些嵌套的虚拟dom对象组成，还包括各种生命周期钩子、自定义方法、事件等组成 下面让我们继续探索 react组件写法 ...

一、jsx变createElement 每一个用jsx语法书写的react组件最后都会变成 react.createElement(...)这一坨东西， 通过看代码就知道：header这个组件有三个子元素： span text 变量 可以说每遇到一个html ...

一、ReactDOM.render 都干啥了 我们在写react的时候，最后一步肯定是 我们上面得知jsx被解析成了虚拟dom对象，我们把一个对象和一个dom传入render方法就得到了我们的页面，好神奇呀，我们开始撸到render方法： 抛开 ...

前言 对源码的解读有利于搞清楚Hooks到底做了什么，如果您觉得useEffect很“魔法”，这篇文章也许对您有些帮助。 本篇博客篇幅有限，只看useEffect，力求简单明了，带您到React Hooks的深处看看 按图索骥找到Hook相关源码（可以直接跳） 首先我们从Github上得 ...

引言 在上一篇文章中我们通过create-react-app脚手架快速搭建了一个简单的示例，并基于该示例讲解了在类组件中React.Component和React.PureComponent背后的实现原理。同时我们也了解到，通过使用Babel预置工具包@babel/preset-react ...

　　React可大致分为三部分：Core、Reconciler和Renderer，在阅读源码之前，首先需要搭建测试环境，为了方便起见，本文直接采用了网友搭建好的环境，React版本是16.8.6，与最新版本很接近。 一、目录结构 　　React采用了由Lerna维护monorepo方式进行代码 ...

context 在线源码地址：https://github.com/facebook/react/blob/master/packages/react/src/ReactContext.js 两种实现方式 childContextType (17版本将被废弃 ...

引言 如今，主流的前端框架React，Vue和Angular在前端领域已成三足鼎立之势，基于前端技术栈的发展现状，大大小小的公司或多或少也会使用其中某一项或者多项技术栈，那么掌握并熟练使用其中至少一种也成为了前端人员必不可少的技能饭碗。当然，框架的部分实现细节也常成为面试中的考察要点，因此，一方 ...