jsx和vdom

说一下对组件化的理解

• 什么是组件：组件的定义和引用
• 组件的封装：封装视图、数据、变化逻辑
• 组件的复用：props 传递、复用

JSX

• JSX 语法（标签、JS 表达式、判断、循环、事件绑定）
• JSX 是语法糖，需被解析成 JS 才能运行 JSX
• 是独立的标准，可被其他项目使用
  JSX 是 React 引入的，但不是 React 独有的，React 已经将它作为一个独立标准开放，其他项目也可用，React.createElement 是可以自定义修改的
  说明：本身功能已经完备；和其他标准监控和扩展性没问题

JSX 和 vdom 的关系

1、为何需要 vdom

• vdom 是 React 初次推广开来的，结合 JSX
• JSX 就是模板，最终要渲染成 html
• 初次渲染 + 修改 state 后的re-render
• 正好符合 vdom 的应用场景

2、React.createElement 和 h ，都生成 vnode
3、何时 patch

• 初次渲染 - ReactDOM.render(, container) 会触发 patch(container, vnode)
• re-render - setState 会触发 patch(vnode, newVnode)

4、自定义组件的解析：初始化实例，然后执行 render