> JSX是Javascript和XML结合的一种格式。该语法会自动将html标签转换为纯JS再由浏览器执行
### 1.JSX 的基本语法规则：遇到 HTML 标签（以 < 开头），就用 HTML 规则解析；遇到代码块（以 { 开头），就用 JavaScript 规则解析。egs:
~~~
import React, { Component } from 'react';
var names = ['柯南', '毛利兰', '毛利小五郎', '怪盗基德']
class Study extends Component {
render() {
return <div>
{
names.map(function (name) {
return <p>Hello, {name}!</p>
})
}
</div>
}
}
export default Study
~~~
### 2.JSX 允许直接在模板插入 JavaScript 变量。如果这个变量是一个数组，则会展开这个数组的所有成员。egs:
~~~
import React, { Component } from 'react';
var names = [
<p>Hello pi</p>,
<p>Hello xiao</p>,
<p>Hello tong</p>,
<p>Hello li</p>,
]
class Study extends Component {
render() {
return <div>{names}</div>
}
}
export default Study
~~~
