React入门
http://www.ruanyifeng.com/blog/2015/03/react.html
ReactDOM.render 是React的最基本的方法，用于将模板转为HTML语言，并插入制定的DOM节点中。
<!DOCTYPE html><html><head><scriptsrc="../build/react.js"></script><scriptsrc="../build/react-dom.js"></script><scriptsrc="../build/browser.min.js"></script></head><body><divid="example"></div><scripttype="text/babel"><!--React独有的JSX语法，需要的type 为text/babel 凡是使用JSX语法的 type都是这个-->ReactDOM.render(<h1>Hello, world!</h1>,document.getElementById('example'));</script></body></html>
JSX语法，html语言直接写在 javascript代码中， 不加任何引号，支持html和js的混写，
遇到html标签（以 < 开头），就以html解析，遇到代码块 （以 { 开头 ） 则以JavaScript 规格解析；
<script type="text/babel">var names =['Alice','Emily','Kate'];ReactDOM.render(<div>{names.map(function(name){return<div>Hello,{name}!</div>})}</div>,document.getElementById('example'));</script>
JSX语法允许直接在模板插入 javascript变量，如果这个变量是数组，则会展开这个数组的全部成员；
<script type="text/babel">var arr =[<h1>Hello world!</h1>,<h2>React is awesome</h2>,];ReactDOM.render(<div>{arr}</div>,document.getElementById('example'));</script>
组件
React允许将代码封装成组件（component） ，然后像插入普通HTML标签一样，在网页中插入这个组件。
React.createClass 方法就是用来生成这个组件类的；
<script type="text/babel">varHelloMessage=React.createClass({render:function(){return<h1>Hello{this.props.name}</h1>;}});ReactDOM.render(<HelloMessage name="John"/>,document.getElementById('example'));</script>
上面代码中，变量 HelloMessage 就是一个组件类， 模板插入 <HelloMessage />变回自动创建一个这样的实例，
所有组件类都有自己的render方法，用于输出组件；
组件的第一个字母必须大写，否则会报错，另外 组件类只能保安一个顶层标签（只能有一个顶层标签，然后包含很多子标签） ，否则也会报错。
组件的用法和原生HTML标签完全一致，可以任意的加入属性，比如 name属性，组件的属性可以在组件类的this.props 对象上获取， 但是 class 属性和for属性 在组件属性中，名称分别改为了 className htmlFor 因为 class 和for是javascript 的保留字。
this.props.children
this,props 对象的属性与组件一一对应 但是有一个例外 就是 this.props.children 属性，它表示组件的所有子节点
<script type="text/babel">varNotesList=React.createClass({render:function(){return(<ol>{React.Children.map(this.props.children,function(child){return<li>{child}</li>;})}</ol>);}});ReactDOM.render(<NotesList><span>hello</span><span>world</span></NotesList>,document.getElementById('example'));</script>
this.props.children 的值有三种可能，如果当前组件没有子节点，他就是 undefind ，如果有一个子节点，数据类型是object 如果有多个子节点 那么它就是 array 。。。
React 提供了一个工具方法， React.Children 来处理 this.props.children 我们可以用 React.Children.map来遍历子节点
不用担心 this.props.children 的数据类型了~
