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。

setState in reactjs is Async or Sync