这是我参与 第五届青训营 伴学笔记创作活动的第6天，今天学习的是响应式系统与React React历史 2010年，Facebook 在其 php 生态中，引入了 xhp 框架，首次引入了组合式组件的思想，启发了后来的 React 的设计 2011年，Jordan Walke 创造了 FaxJS，也就是后来的React 原型 2012年，在Facebook收购Instagram后，该FaxJS项目在内部得到使用，Jordan Walke 基于FaxJS的经验，创造了React 2013年，React正式开源，在2013 JSConf 上Jordan Walke 介绍了这款全新的框架 React的设计思路 UI编程痛点 01 状态更新，UI 不会自动更新，需要手动地调用 DOM 进行更新 02 欠缺基本的代码层面的封装和隔离，代码层面没有组件化 03 UI 之间的数据依赖关系，需要手动维护，如果依赖链路长，则会遇到 “Callback Hell” 响应式与转换式 响应式系统：监听事件，消息驱动 （监控系统、UI界面） 事件——>执行既定的回调——>状态更新——>UI更新 状态更新，UI自动更新 前端代码组件化，可复用，可封装 状态之间的互相依赖关系，只需声明即可 组件化 组件是 组件的组合/原子组件 组件内拥有状态，外部不可见 父组件可将状态传入组件内部 状态归属问题 状态归属于两个节点向上寻找到最近的祖宗节点 组件有Props/State两种状态 “组件”可由其它组件拼装而成 Diffing 算法 对同一层次的节点进行比较。算法核心：复用 旧虚拟 DOM 中找到了与新虚拟 DOM 相同的 key： 若虚拟 DOM 中内容没变，直接使用之前的真实 DOM 。 若虚拟 DOM 中内容变了，则生成新的真实 DOM，随后替换掉页面中之前的真实 DOM。 旧虚拟 DOM 中未找到与新虚拟 DOM 相同的 key： 根据数据创建新的真实 DOM ，随后渲染到到页面。 react对于初学者还是有点难度，慢慢学习
