在前端圈子里，对于 Babel，大家肯定都比较熟悉了。如果哪天少了它，对于前端工程师来说肯定是个噩梦。Babel 的工作原理是怎样的可能了解的人就不太多了。 本文将主要介绍 Babel 的工作原理以及怎么写一个 Babel 插件。 Babel 是一个 JavaScript 编译…

React v16.7.0-alpha 中第一次引入了 Hooks 的概念，在 v16.8.0 版本被正式发布。React Hooks 在 React 中只是对 React Hook 的概念性的描述，在开发中我们用到的实际功能都应该叫做 React hook。 React Ho…

上一篇文章我们主要实现了 JSX 在 WebGL 上的渲染与更新，对 虚拟DOM 和 Diff 有了更深的了解，但相比于我们使用的 React，还缺乏了之中很重要的一环 --- 组件模式。 想必大家能认同，React组件(Component)具有 强大的功能，高拓展性和高解耦性…

之前面试三部曲简明地梳理了前端知识结构体系，浅尝辄止。这个系列则要进一步研究和领会 内在的奥妙。今天打算以一个比较新颖的角度切入，深入地梳理下 React 的内部实现。 1. 有利于大家在 React 日常业务使用中更加得心应手； 2. 也可将领会到的思想融会贯通，拓展到其它领…

首先我们先看一个简单的表单，收集并校验两个组件的值。只需要通过监听两个表单组件的 onChange 事件，获取表单项的 value，根据定义的校验规则对 value 进行检验，生成检验状态和检验信息，再通过 setState 驱动视图更新，展示组件的值以及校验信息即可。 上面的…

计算属性以声明的方式创建依赖关系，依赖的 data 或 props 变更会触发重新计算并自动更新。 计算属性是基于它们的响应式依赖进行缓存的。 在上面的代码里，render 函数里的 fullName 依赖了 props 中的 firstName 和 lastName 。fir…