这是我参与「第四届青训营 」笔记创作活动的第1天
React简介
React主要用于构建UI。你可以在React里传递多种类型的参数，如声明代码，帮助你渲染出UI、也可以是静态的HTML DOM元素、也可以传递动态变量、甚至是可交互的应用组件。
React的设计与实现-组件化
示例：苹果商城官网的React结构
图片中的总金额是由Root将onChangeValue()向下传递
我们能得出的结论为：
- 组件是组件/原子组件
- 组件内拥有状态。外部不可见
- 父组件可将状态传入组件内部
React的设计思路-状态归属问题
react是单向数据流，是父组件向子组件提供一个函数，然后子组件执行这个函数。
React的设计思路-组件化
组件不仅声明了状态和UI的映射，组件还有Pros/State两种状态，“组件”还可由其拼装而成。
React的设计思路-生命周期
React的设计思路-响应式编程
function Component(props){
//pros是父组件传入的状态
const{ url }=Props;
this.text='点击我'；//状态
//返回一个“UI”
return (<div>
<subcompont Props={{ color:'red'}}></subcompont>
<img src={url}></img>
<button>text</button>
</div>)
}
React 的实现
Virtual DOМ（虚拟 DOM )
Virtual DOM 是一种用于和真实 DOM 同步，而在 JS 内存中维护的一个对象，它具有和 DOM 类似的树状结构，并和 DOM 可以建立一一对应的关系。
它赋予了 React 声明式的 API ：您告诉 React 希望让 U 是什么状态， React 就确保 DOM 匹配该状态。这使您可以从属性操作、事件处理和手动 DOM 更新这些在构建应用程序时必要的操作中解放出来。
