## 方法順序遵循生命周期放在前面，?`render()`?方法放在最后
在?`react`?組件內部，方法的順序如下：
1. 生命周期方法（按照時間先后順序依次為：?`getDefaultProps`,?`getInitialState`,?`componentWillMount`,`componentDidMount`,?`componentWillReceiveProps`,?`shouldComponentUpdate`,?`componentWillUpdate`,`componentDidUpdate`,?`componentWillUnmount`?）
2. 其他的方法
3. `render`?方法
## 事件處理函數的命名
采用 "handle" + "EventName" 的方式來命名
Example：
~~~
<Component onClick={this.handleClick} onLaunchMissiles={this.handleLaunchMissiles} />
~~~
## 事件函數作為屬性時的命名
為了跟?`react`?的事件命名保持一致：?`onClick`,?`onDrag`,?`onChange`, 等等，采用如下格式：
~~~
<Component onLaunchMissiles={this.handleLaunchMissiles} />
~~~
## 元素跟?`return`?放在同一行
為了節約空間，采用下面的寫法：
~~~
return <div>
...
</div>;
~~~
而不是：
~~~
return ( // "div" 與 "return" 不在同一行
<div>
...
</div>
);
~~~
## 對HTML的屬性進行對齊和排序
如果屬性不是太多，那就放在同一行，否則就把每一個屬性都單獨寫一行：
~~~
<div className="highlight" key="highlight-div">
<div
className="highlight"
key="highlight-div"
>
<Image
className="highlight"
key="highlight-div"
/>
~~~
而不是：
~~~
<div className="highlight" // 屬性沒有在單獨行
key="highlight-div"
>
<div // 閉合便簽不在單獨的行
className="highlight"
key="highlight-div">
<div // 屬性沒有排序（一般重要的屬性寫在前面）
key="highlight-div"
className="highlight"
>
~~~
## 一個文件只導出一個 react 類
每一個?`.jsx`?應該只能導出單獨的?`react 類`。這樣有利于測試，因為這些測試框架要求一個文件導出的就是一個函數。
*注意：你依然可以在一個文件中定義多個類，只要保證導出的只有一個即可。*
