这是我参与「第五届青训营 」笔记创作活动的第6天
一、本堂课重点内容：
- UI 编程痛点
- 响应式与转换式
- React 设计与实现 - 组件化
- React 设计与实现 – 状态归属问题
- React 的实现基本概要
- React 的实现 - Problem 1 & 2
- React 的实现 - How to Diff
- React 状态管理库 - 核心思想
- React 状态管理库 - 状态机
- React 状态管理库 - Modern.js/Reduck
二、详细知识点介绍：
react在2013年正式开源，由于状态更新，UI不会自动更新，需要人为的手工去调用DOM来进行更新，效率严重低下。然后代码层也没有组件化，如果UI之间的数据依赖链路过长，会导致返回失败。因此react设计了出来，可以利用react完美解决上述问题。
响应式是事件->执行既定的回调->状态变更。前端UI则多一个UI更新，而组件化可以通过组件的组合或者原子组件来进行拆分，并且拥有各自的状态，外部不可见，父组件还可以将状态传入组件内部。状态归属问题，它属于两个节点向上寻找到最近的祖宗节点，因此react是单向数据流。组件内部也拥有自己的私有状态State，还可以接受外部的props状态提供复用性，还可以根据当前的state/props，返回UI。
react实现可以利用props传入父组件的状态，来进行返回一个UI。也可以利用虚拟DOM，来建议一一对应的联系，它与真实DOM同步。
如果实现DIFF，可以根据不同类型的元素进行替换，或者对于同类型的DOM元素进行更新，也可以同类型的组件元素进行递归。
状态管理库的核心思想就是将状态抽离到UI外部进行统一管理。状态机就是当前状态收到外部事件，迁移到下一个状态。 modern.js是字节跳动开公司内部开发的一个框架，可以利用model进行一个整合，方便组件使用，来进行的一个UI反馈。
三、实践练习例子：
- 有什么实践举例帮助理解知识点？
usemodel(countmodel)，只要model申明出来，可以在任意的地方调用，非常的方便。
还有就是react使用到的方法。如图所示。
四、课后个人总结：
本期收获了非常多，了解了什么是react，react能带来哪些好处和方法，以及各种框架的一个优势，这说明计算机行业就是一直在进步，需要不断的学习探索，“lets make the web faster!”
