关于react.js:与React缘分最深的JSX一

JSX真香
在应用了React之后会有一种JSX真香的赶脚

JSX背地的故事
JSX为JavaScript的一种语法扩大，齐全具备JavaScript的能力
留神，JSX不是JavaScript的新版本
JSX是如何Javascript中失效的？

这里要晓得一个货色：Babel（*工具链，次要用于将ECMAScript2015+版本的代码转换为向后兼容的JavaScript语法*）

JSX会被Babel编译为React.createElement()，而React.createElement()将返回ReactElement的JS对象
下图是在Babel官网试验的一段代码，能够更好的了解下面的一句话
![image.png](/img/bVcHQuH)
createElement的三个参数
    1、type：能够是html标签（div，span），也能够是react组件类型或者fragement类型
    2、config：对象，组件所有属性都以键值对的模式存储在该对象中
    3、children：对象，组件标签之间嵌套的内容
ReactElement只实现了一件事件，就是组装，将传入的参数，依照肯定的标准进行组装，并返回给React.createElement()
const testJSX = <div>
    Hello JSX
</div>
console.log(textJSX)
以上一段代码，在打印testJSX时，会发现输入的时一个ReactElement对象实例，即虚构DOM
而虚构DOM到实在DOM，是ReactDOM来进行实现的
ReactDOM.render()
将组件挂载在实在DOM的节点上