react怎么檢測到數據的變化？

react狀態變化只能通過setState()，調用setState()就會更新狀態重新渲染dom

為什么不直接更新state？

1. 如果試圖直接更新state，則不會重新渲染組件
2. 需要使用setState()方法去更新state，它調度對組件state對象的更新，組件通過重新渲染來響應

react中，在執行setState()方法后發生了什么？

咱們可以將“render”分為兩個步驟：

1. 虛擬DOM渲染：

當render方法被調用時，它會返回一個新的組件的虛擬DOM結構。當調用setState()時，render會被再次調用因為默認情況下shouldComponentUpdate總會返回true，所以默認情況下react是沒有優化的。

? ? ?2. ?原生DOM渲染：

react只會在虛擬DOM中修改真實DOM節點，而且修改的次數非常少，優化了真實DOM的變化，使得react變得更快。

setState()是同步的還是異步的？

看setState具體的執行位置：

1. 在react控制的回調函數中【異步】：生命周期鉤子/react事件回調
2. 非react控制的異步回調函數中【同步】：定時器回調/原生事件監聽回調/promise回調

setState的“異步”并不是說內部由異步代碼實現，其實本身執行的過程和代碼都是同步的，只是合成事件和鉤子函數的調用順序在更新之前，導致在合成事件和鉤子函數中沒法立馬拿到更新后的值，形成了所謂的“異步”，咱們也可以通過第二個參數setState(partialState,callback)中的callback拿到更新后的結果，該callback接收上一個state的值和當前的props，并返回一個新的狀態。

setState的批量更新優化也是建立在“異步”（合成事件、鉤子函數）的基礎上。

在原生事件和setTimeout中不會批量更新，在“異步”中如果對同一個值進行多次setState，setState的批量更新政策會對其進行覆蓋，取最后一次的執行，如果是同時setState多個不同的值，在更新時會對其進行合并批量更新。

setState為什么會進行異步操作？

1. 保持內部一致性：props的更新是同步的，因為render父組件時，傳入子組件的props才會發生變化，為了保持數據的一致性，state也不直接更新，都是flush時才更新。
2. 將state的更新延緩到最后批量合并再去渲染對應用的性能優化是具有極大好處的，如果每次的狀態改變都回去重新渲染真實的DOM，將會帶來巨大的性能消耗。
3. 立即更新回來視覺上的不適應，比如在頁面打開的時候，多個請求發布導致頻繁更改Loading,會導致Loading圖標閃爍。

關于異步的setState()

1. 多次調用，怎么處理？

setState({}):合并更新一次狀態，只調用一次render()更新界面---狀態更新和頁面更新都合并了

setState(fn):更新多次狀態，但只調用一次render()更新頁面---狀態更新沒有合并，但界面更新合并了

? ? 2.?如何得到異步更新后的狀態數據？

在setState()的callback回調函數中。