當組件第一次渲染的時候執行哪些生命周期？

constructor--->componentWillMount--->render--->componentDidMount

1.constructor

初始化

當前生命值周期可以定義當前組件所需要的狀態

當前生命周期函數必須寫super，否則就會報錯或者this的指向發生改變

如果在super和constructor中沒有傳遞props這個參數的話是訪問不到this.props屬性的

2.componentWillMount

組件掛載前

在當前生命周期函數裏可以訪問到props屬性，在這裏可以接收外部屬性，同時可以將外部屬性轉變成內部屬性

在當前生命周期函數裏不需要調用setState,因為當前函數執行完畢後會自動執行render

3.render

a.render函數什麽時候會執行？

當this.state,this.props發生改變的時候，會執行render函數

b.this.state/this.props發生改變的時候會執行哪些生命周期函數

　　this.state:

　　　　shouldComponentUpdate--->componentWillUpdate--->render--->componentDidUpdate

　　this.props

　　　　componentWillReveiceProps--->shouldComponentUpdate--->componentWillUpdate--->render--->componentDidUpdate

c.render函數執行的時候會將虛擬DOM和數據相結合，緩存一份虛擬DOM，當數據發生改變的時候會將虛擬DOM與緩存的虛擬DOM作比較（diff算法），比較完畢以後，將需要修改的虛擬DOM進行批量修改，減少不必要的更新。

d.diff算法

新舊兩個虛擬DOM的對比就是diff算法

4.componentDidMount

render函數執行後，componentDidMount這個生命周期函數就會執行，在這個生命周期函數裏可以進行fatch請求，獲取真實DOM

5.componentWillUnMount

組件銷毀

6.shouldComponentUpdate

當this.state,this.props發生改變時，會執行render函數

該生命周期函數必須返回一個布爾值，如果返回true,則繼續執行下面的生命周期函數；

　　　　　　　　　　　　　　　　　如果返回false,則下面的生命周期函數不執行。

該生命周期函數是用來判斷DOM是否更新的，而不是用來判斷數據是否更新的（不管返回值是true還是false，this.state裏的數據都會改變，但是DOM值不會改變）

該生命周期函數可以做一些相關操作減少虛擬DOM不必要的更新（利用接收到的兩個參數props,state來比較）

7.componentWillUpdate

更新前 虛擬DOM與數據相結合，但沒有真正的DOM結構

8.componentDidUpdate

更新後 數據與模板結合可以產生真正的DOM結構，在這裏可以獲取到數據更新後最新的DOM結構

9.componentWillReceiveProps

當外部屬性發生變化的時候就會執行當前生命周期函數，當前生命周期函數會有一個新的參數props

操作DOM的兩種方式：

ref="list" this.refs.list

ref={(tagName)=>{this.key=tagName}} this.key

react生命周期函數哪些只執行一次？

constructor

componentWillMount

componentDidMount

componentWillUnMount

react生命周期函數哪些可以執行多次？

render

shouldComponentUpdate

componentWillUpdate

componentDidUpdate

componentWillReceiveProps

react的生命周期