JSX
常用的jsx元素节点：
- element元素类型
- fragment类型(React.Fragment)
- text文本类型
- 数组节点类型(map)
- 组件类型
- 三元运算
- 函数执行({func()})
JSX元素节点会被Babel编译成React Element形式.
React.createElement( type, [props], [...children] )
type参数：组件类型:传入对应的类名或函数名；dom元素类型：传入div等元素字符串 [props]参数：对象、组件的props或dom元素的标签属性 args其他参数：依次按序为children
jsx的转换规则：
| jsx元素类型 | react.createElement转换后 | type 属性 |
|---|---|---|
element元素类型 | react element类型 | 标签字符串，例如 div |
fragment类型 | react element类型 | symbol react.fragment类型 |
| 文本类型 | 直接字符串 | 无 |
| 数组类型 | 返回数组结构，里面元素被react.createElement转换 | 无 |
| 组件类型 | react element类型 | 组件类或者组件函数本身 |
| 三元运算 / 表达式 | 先执行三元运算，然后按照上述规则处理 | 看三元运算返回结果 |
| 函数执行 | 先执行函数，然后按照上述规则处理 | 看函数执行返回结果 |
React底层调和处理后，jsx终将变成fiber对象：
在调和阶段，React针对不同React element对象会产生不同tag (种类)的fiber对象。上述React element对象的每一个子节点都会形成一个与之对应的fiber对象，这些fiber对象之间通过sibling、return、child联系起来。
JSX会先转换成React.element，再转化成React.fiber
fiber 对应关系
- child： 一个由父级fiber指向子级fiber的指针
- return：一个子级fiber指向父级fiber的指针
- sibling: 一个fiber指向下一个兄弟fiber的指针
相关API
React.isValidElement()方法用于检测待验证对象是否为React element元素
React.createElement()和React.cloneElement(): 前者用于创建React element，后者是用来修改React element，并返回一个新的React.element对象。
