React 顶层 API

React.createClass(obj)

创建一个 ReactClass(组件类), 参数是一个对象且必须有 render 属性. 该方法必须返回一个封闭的容器或 null/false(表示不渲染)

在该方法中, 所有的 this 都会在最终调用的时候绑定到创建的组件的构造器上.

React.createElement(TYPE(string|ReactClass)[, PROPS[, CHILDREN(ReactElement)]])

创建一个指定类型的 React 元素(要区分 ReactClass(通性) 和 ReactElement( 个性) 和 Virtual DOM(实例), 通过 ReactClass 创建 ReactElement, 然后实例化成 Virtual DOM: 比如 ButtonComponent 是 Class, 而<ButtonCompoennt />则是 Element, 最后通过 ReactDOM.render() 生成Virtual DOM)
第三个参数 Children 可以是人一个书的 React 元素

React.createElement('div', null, 
  React.createElement('p', null, 
    React.createElement(Component, {a:1})
  )
)
`</pre>

### React.cloneElement(TYPE(ReactElement)[, PROPS(object)[, CHILDREN(ReactElement)]])

克隆并返回一个新的 ReactElement(内部子元素也会随之克隆), 新返回的元素会保留就元素的 props, ref, key, 也会集成新的 props( 如果第二个参数不为 null)

<pre>`var Hello = React.createClass({
  render: function(){
    var span = &lt;span a = '1'&gt;Span&lt;/span&gt;;
    var newSpan = React.cloneElement(span,{b:'2'}, &lt;em&gt;EM&lt;/em&gt;);
    console.log(newSpan.props);
    return &lt;div&gt;Hello {span},{newSpan}&lt;/div&gt;;
  }
});
`</pre>

注意 createElement的第一个参数必须是字符串或者 ReactClass, 而 cloneElement 的第一个参数只能是 ReactClass

### React.createFactory(TYPE(string|ReactElement))

返回一个某种类型的 ReactElement 工厂函数, 可以利用返回的函数来创建一个 ReactElement( 配置 props 和 children)

<pre>`var Component = React.createClass({
  render:function(){
    return this.props.a == 1? &lt;p&gt;123&lt;/p&gt; : null;
  }
});

var p = React.createFactory(Component),
    ReactElementP = p{{a:1}},
    div = React.createFactory('div'),
    ReactElementDiv = div(null, ReactElementP);

React.render(
  ReactElementDiv, document.body
);
`</pre>

### React.render(REACTELEMENT(ReactElement), CONTAINER(DOMElement)[, CALLBACK(function)])

渲染一个 ReactElement 到 container 指定的 DOM 中, 并返回一个到该组件的引用. 如果提供了可选的回调函数, 则该函数会在组件渲染或更新之后调用

如果我们希望在组件外部可以获得组件内部(能通过 this 访问)的东西, 可以将 React.render 的返回值赋予一个变量, 在后续的调用中访问变量即可.

### React.unmountComponentAtNode(CONTAINER(DOMElement)

从 container 指定的 DOM 中移除已经加载的 ReactElement, 清楚相应的事件处理器和 state, 如果在 container 中没有存在的组件, 则不作处理
如果组件清除成功, 则返回 true

### React.renderToString(REACTELEMENT(ReactElement))

React 为服务端提供的一个方法, 可以直接输出 ReactElement 为 HTML 字符串, 将这些标记发送(比如 res.write(HTMLString))给客户端, 可以获得更快的页面加载速度, 并有利于搜索引擎的抓取

<pre>`var com = &lt;Component /&gt;
comHTML = React.renderToString(com) //HTMLString
`</pre>

### React.renderToStaticMarkup

类似于 React.renderToString, 但只生成纯粹的 HTML 标记字符串, 不会包含类似 dta-reactid 之类的 React 属性, 从而节约字节数

### React.initializeTouchs(ShouldUserTouch(boolean))

开启或关闭 React 的触摸事件机制, 传入参数 true 使 React 响应 Touch 事件

### React.Chilren

#### React.Children.map(obj children, function[, object context])

遍历子元素, 映射为一个新的子元素集合

<pre>`var Component = React.createClass({
  render: function(){
    return (
      &lt;ul&gt;
        {React.Children.map{
          this.props.children, function(){
            return &lt;li&gt;{child}&lt;/li&gt;
            }
          }
        }
      &lt;/ul&gt;
    )
  }
})