while循環的行為不符合JavaScript中的預期

Question

首先，必須說這可能是setState問題，因為我一直對此感到有些麻煩，但是我無法弄清楚為什么while循環無法正常工作。

碼：

dealerTwisted = () => {
    console.log(this.state.dealersOverallTotal, 'total on entry');
    let looping = true;
    while(looping){
      console.log(this.state.dealersOverallTotal,'same');
      if(this.state.dealersOverallTotal < 17){
        this.deal2Dealer();
        let dealersDeck = this.state.dealersDeck;
        let newDealersDeckTotal = [];
        for (var i=0; i < dealersDeck.length; i++){
          newDealersDeckTotal.push(dealersDeck[i].rankValue)
        }
        let total = newDealersDeckTotal.reduce(function(a, b) {
          return a + b;
        },
        0);
        console.log(total, 'tot');
        this.setState({ dealersOverallTotal: total });
      }
      else{
        console.log(this.state.dealersOverallTotal, 'logging as greater than 17');
        if(this.state.playersOverallTotal > this.state.dealersOverallTotal){
          console.log('player wins!');
          looping = false;
        }
        else if (this.state.playersOverallTotal > this.state.dealersOverallTotal){
          console.log('its a tie!');
          looping = false;
        }
        else {
          console.log('dealer wins!');
          looping = false;
        }
      }
    }
  };

我的想法和希望它的工作方式如下：調用該函數，進入循環，如果this.state.dealersOverallTotal小於17，則輸入if塊。然后總計被更新，並且然后您再次開始循環。 您將繼續輸入if塊，直到得到大於17的數字。一旦您輸入else塊，然后無論您在其中遇到什么條件，都將爆發。

有趣的是，我剛剛調試並發現此行（第一台控制台日志） console.log(this.state.dealersOverallTotal, 'total on entry'); 每次給我相同的數字，即內部不更新一次。 誰能看到為什么？

Answer 1

React的setState是異步的，因此您的this.state.dealersOverallTotal永遠不會達到17。

reactjs中的setState是Async還是Sync