Javascript – asynchrone Ausführungsreihenfolge in jedem Deklarationszyklus in React

Question

componentWillMount(){
    setTimeout(()=>{
      alert(1);
    },100)
  }

  componentDidMount(){
    setTimeout(()=>{
      alert(2);
    },100)
  }
  

Die beiden Lebenszyklusfunktionen in der Komponente haben asynchrone Vorgänge. Entspricht die Ausführungsreihenfolge strikt der Reihenfolge des Deklarationszyklus, also zuerst 1 und dann 2? Reihenfolge der Einfügung in die Nachrichtenwarteschlange? Das Problem kann unter der Annahme verstanden werden, dass die Rückgabezeit des asynchronen Ergebnisses von ComponentWillMount sehr lang und die Rückgabezeit des asynchronen Ergebnisses von ComponentDidMount sehr kurz ist. Ist es möglich, zuerst das Rückrufergebnis in ComponentDidMount auszuführen und dann auszuführen? Das Rückrufergebnis ergibt „componentWillMount

“.

Answer 1

简化问题为：假设两个异步动作 A 和 B 触发顺序已知，那么 A 和 B 中同样延时的 setTimeout 是否能保证顺序？

答案显然是不能的。例如当 A 和 B 之间只有微秒级延时时，两个设定了巨大延时的 setTimeout 就不能保证按照调用 setTimeout 时的先后顺序触发。

不能够依赖这种脆弱的时序关系来保证代码的执行顺序。在 Code Review 中如果遇到利用这种关系来实现数据初始化、异步请求等功能的代码，答主肯定是会提出意见的。对于异步的控制流，可以采用 Promise / yield 等方式来保证执行顺序，在这里就不赘述了。