React組件生命週期有三個階段：加載、更新和卸載。每個階段有多個方法來調用實現某些功能。這些方法名字也很有意思，帶will前綴表示在該階段發生之前調用，did表示在該階段發生之後調用。本文將介紹這些方法。本文翻譯自React官網文檔，如有翻譯不當，請不吝指正。
1. Mounting階段：該階段表示一個組件實例被創建並被插入到DOM中。該階段有四個方法：constructor()，componentWillMount()，render()和componentDidMount()。
- constructor(props)：該方法在組件加載前調用。當組件作爲
React.Component的子類實現時需要在其他聲明之前先調用super(props)。否則，this.props在構造器中會是undefined，這會導致代碼出現bug。
作用：用來初始化狀態，如果既不初始化狀態也不綁定方法，那就沒必要實現該方法了。（筆者注：事實上，如果組件沒有構造器方法的話，組件會默認調用一個構造器，實現屬性的傳遞）。 - componentWillMount()：該方法會在加載發生前調用。因爲它發生在
render()方法前，因此在該方法內同步設置狀態不會引發重渲染。該方法還是服務器端渲染的唯一的生命週期鉤子。一般，推薦用constructor()代替該方法。 - render()：該方法必須要有。當調用時，它會檢查
this.props和this.state，然後返回一個React元素。這個元素可以是原生DOM組件如div，也可以是一個自定義的複合組件。如果什麼也不想渲染的話，可以返回null或false。當返回null或false時，ReactDOM.findDOMNode(this)會返回null。該方法應該是純淨的，這意味着它不能修改組件狀態，每次調用會返回相同的結果，不會和瀏覽器發生直接的交互。如果想要同瀏覽器發生交互的話，應該在componentDidMount()中實現。 - componentDidMount()：組件加載完成後觸發。
作用：放置必要的DOM節點。如果要從遠程節點加載數據，這是一個不錯的實例化網絡請求的地方。也可以在此處設置定時器等。
注意：在該方法內設置狀態會導致重渲染。
2. Updating階段：該階段表示由狀態或屬性的改變導致組件的重渲染。該階段有五個方法：componentWillReceiveProps()，shouldComponentUpdate()，componentWillUpdate()，render()和componentDidUpdate()。
- componentWillReceiveProps(nextProps)：該方法會在加載好的組件在收到新的狀態後調用。如果需要更新狀態以反映屬性的改變，可以在比較
this.props和nextProps後，使用this.setState()方法來實現狀態的過渡。
注意：React可能會在props值並未改變的時候調用該方法，所以要確保每次處理改變時都要比較當前props和收到的props值。這可能發生在父組件導致該組件重渲染時。
非觸發時期：mounting階段不會調用該方法。只有在部分props屬性更新時調用該方法，另外調用this.state()不會觸發該方法。 - shouldComponentUpdate(nextProps, nextState)：該方法用來告訴React，組件輸出是否受到當前狀態或屬性的影響。默認情況下，每次狀態改變都會導致重渲染，在大多數情況下，你只需保持該默認行爲即可。該方法在收到新的props或state時會被調用，且調用是在重渲染前。該方法默認返回
true。但返回false不會影響其子組件在狀態改變時的重渲染。
非觸發時期：初次渲染或使用forceUpdate()時不會調用該方法。
注意：就目前而言，如果該方法返回false，以後的componentWillUpdate()，render()和componentDidUpdate()都不會再調用了。但未來可能該方法返回的結果只是作爲暗示，而非指令，返回false可能仍會導致重新渲染。
最後，如果找到了導致性能低下的組件，可以使它繼承React.PureComponent。該組件用props和state的淺比較實現了shouldComponentUpdate()。也可以自己實現該方法，通過this.props同nextProps比較，this.state同nextState比較，然後返回false以跳過更新。 - componentWillUpdate()：該方法在收到新屬性和狀態渲染前調用。可以用它來做更新前的準備工作。
注意：該方法不可以調用this.setState()。如果需要更新狀態以響應屬性的改變，使用componentWillReceiveProps(nextProps)代替。
非觸發時期：初次渲染不會調用該方法。shouldComponentUpdate()返回false不會調用該方法。 - render()：該方法是mount和update階段都會使用到的方法，解釋同mount階段的
render()。
非觸發時期：shouldComponentUpdate()返回false不會調用該方法。 - componentDidUpdate(prevProps, prevState)：更新發生後會立即調用該方法。可用來在組件更新後操作DOM。另外，也可以通過比較當前屬性和之前屬性來決定是否發送網絡請求（如，狀態未改變不需要做網絡請求）。
非觸發時期：初次渲染不會調用該方法。shouldComponentUpdate()返回false不會調用該方法。
3. Unmounting階段：該階段表示組件將從DOM中移除。該階段只有一個方法：componentWillUnmount()。
- componentWillUnmount()：該方法會在組件被銷燬前立即調用。
作用：可以在方法內實現一些清理工作，如清除定時器，取消網絡請求或者是清理其他在componentDidMount()方法內創建的DOM元素。