javascript - react 中各個聲明周期中異步的執行順序
問題描述
componentWillMount(){ setTimeout(()=>{ alert(1); },100) } componentDidMount(){ setTimeout(()=>{ alert(2); },100) }
組件中的2個生命周期函數都有異步操作,執行順序是嚴格按照聲明周期的順序,也就是先1后2,還是不確定執行順序是根據插入到消息隊列里面的先后順序執行的?問題可以理解為假設componentWillMount這個異步結果返回時間很長很長,而componentDidMount這個異步結果返回時間很短,有沒有可能先執行componentDidMount里面的回調結果,然后在執行componentWillMount里面的回調結果
問題解答
回答1:簡化問題為:假設兩個異步動作 A 和 B 觸發順序已知,那么 A 和 B 中同樣延時的 setTimeout 是否能保證順序?
答案顯然是不能的。例如當 A 和 B 之間只有微秒級延時時,兩個設定了巨大延時的 setTimeout 就不能保證按照調用 setTimeout 時的先后順序觸發。
不能夠依賴這種脆弱的時序關系來保證代碼的執行順序。在 Code Review 中如果遇到利用這種關系來實現數據初始化、異步請求等功能的代碼,答主肯定是會提出意見的。對于異步的控制流,可以采用 Promise / yield 等方式來保證執行順序,在這里就不贅述了。
相關文章:
1. javascript - jquery怎么讓a標簽跳轉后保持tab的樣式2. javascript - 請問下面代碼中的...是擴展運算符還是操作運算符?這樣寫是什么意思?3. php多任務倒計時求助4. javascript - 小demo:請教怎么做出類似于水滴不斷擴張的效果?5. css - autoprefixer沒有添加web-kit前綴6. java - spring返回json如何判斷會返回null還是empty?7. css - 如何把一個視圖放在左浮動定位的視圖的上面?8. java 中常量的定義方式。9. python的正則怎么同時匹配兩個不同結果?10. javascript - vue中怎么使用原生js插件
