这是我参与「第五届青训营 」伴学笔记创作活动的第 6 天。
一、React历史与应用
(一)React应用:
1. 前端应用开发,如 Facebook , Instagram , Netflix网页版。
2. 移动原生应用开发,如Instagram , Discord , Oculus。
3. 结合Electron ,进行桌面应用开发。
(二)React历史:
2010年Facebook在其php生态中,引入了xhp框架,首次引入了组合式组件的思想,启发了后来的React的设计。
2011年Jordan Walke创造了FaxJs , 也就是后来的React 原型: Seamless Client Server Rendering
2012年在Facebook l收购Insagam后,该Faxus项目在内部得到使用, Jordan Walke基于FaxJs 的经验,创造了React。
2013年React 正式开源,在2013 JSConf 上Jordan Walke介绍了这款全新的框架: 之后,生态大爆发,各种围绕React的新工具与框架开始涌现
二、React设计思路
1. 从UI编程痛点出发
2. 状态更新,UI不会自动更新﹐需要手动地调用DOM进行更新。
3. 欠缺基本的代码层面的封装和隔离﹐代码层面没有组件化。
4. UI之间的数据依赖关系﹐需要手动维护,如果依赖链路长,则会遇到“Callback Hell”。
三、React响应式编程:
1. 状态更新,uI自动更新。
2. 前端代码组件化,可复用﹐可封装。
3. 状态之间的互相依赖关系﹐只需声明即可。
四、组件化
(一)对组件化的总结
1.组件是组件的组合/原子组件
2.组件内拥有状态,外部不可见
3.父组件可将状态传入组件内部
(二)组件设计
1.组件声明了状态和U的映射。
2.组件有Props/State两种状态。
3.“组件"可由其他组件拼装而成。
(三)组件代码构成
1.组件内部拥有私有状态 State。
2.组件接受外部的Props状态提供复用性。
3.根据当前的State/Props,返回一个U。