ReactJS见习笔记
项目组要求用reactJs搭建前端页面，但是对react一点不了解，边推进项目边学习react。
node.js, npm的关系
Node.js 就是运行在服务端的 JavaScript。NPM是随同NodeJS一起安装的包管理工具。
React
React 是一个用于构建UI的 JAVASCRIPT 库。
React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。也就是说react才3周岁。
React 拥有较高的性能，代码逻辑非常简单.
React 特点
- 声明式设计 −React采用声明范式，可以轻松描述应用。
- 高效 −React通过对DOM的模拟，最大限度地减少与DOM的交互。
- 灵活 −React可以与已知的库或框架很好地配合。
- JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ，但我们建议使用它。
- 组件 − 通过 React 构建组件，使得代码更加容易得到复用，能够很好的应用在大项目的开发中。在React的世界里，一切皆为组件。
- 单向响应的数据流 − React 实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单。
ReactDOM.render()
ReactDOM.render 是 React 的最基本方法，用于将模板转为 HTML 语言，并插入指定的 DOM 节点。
JSX语法
JSX官方定义
XML-like syntax extension to ECMAScript
意即JSX 是一个看起来很像 XML 的 JavaScript 语法扩展，所以JSX的”X”代表的是“XML” 。
- HTML 语言直接写在 JavaScript 语言之中，不加任何引号，这就是 JSX 的语法，它允许 HTML 与 JavaScript 的混写
- JSX 的基本语法规则：遇到 HTML 标签（以 < 开头），就用 HTML 规则解析；遇到代码块（以 { 开头），就用 JavaScript 规则解析。
var arr = [<h1>Hello world!h1>,<h2>React is awesomeh2>,
];
ReactDOM.render(<div>{arr}div>,document.getElementById('example')
);
- JSX 允许直接在模板插入 JavaScript 变量。如果这个变量是一个数组，则会展开这个数组的所有成员
- React 独有的 JSX 语法，跟 JavaScript 不兼容。凡是使用 JSX 的地方，都要加上 type=”text/babel” 。
- 在 JSX 中不能使用 if else 语句，但可以使用 conditional (三元运算) 表达式来替代(同Java，C++中的三元表达式)。
- React 推荐使用内联样式。我们可以使用 camelCase 语法来设置内联样式. React 会在指定元素数字后自动添加 px
