而循环在 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