title: Why does calling the set function of a useState hook apply immediately in async functions?
body: <p>I experienced different behaviors when calling multiple set functions of a useState hook in sync and async functions.</p>
  <pre><code>function Test() {
      console.log('app rendering starts.');
      const [a, setA] = useState(1);
      const [b, setB] = useState(11);
      const updateState = () =&gt; {
          console.log('\tupdating a starts.');
          setA(2);
          console.log('\tupdating a ends.');
          console.log('\tupdating b starts.');
          setB(12);
          console.log('\tupdating b ends.');
      };
      console.log('app rendering ends.');
      return (
          &lt;div className=&quot;App&quot;&gt;
              &lt;div&gt;a is {a}&lt;/div&gt;
              &lt;div&gt;b is {b}&lt;/div&gt;
              &lt;button onClick={() =&gt; {
                  console.log('--------------sync click--------------');
                  updateState();
              }}&gt;Update State a &amp; b Sync&lt;/button&gt;
              &lt;button onClick={() =&gt; {
                  console.log('--------------async click--------------');
                  setTimeout(updateState, 0)
              }}&gt;Update State a &amp; b Async&lt;/button&gt;
          &lt;/div&gt;
      );
  }
  </code></pre>
  <p>Both buttons execute the same code, but in a different way.<br />
  Sync button result:</p>
  <pre><code>app rendering starts.
  app rendering ends.
  --------------sync click--------------
      updating a starts.
      updating a ends.
      updating b starts.
      updating b ends.
  app rendering starts.
  app rendering ends.
  </code></pre>
  <p>Async button result:</p>
  <pre><code>app rendering starts.
  app rendering ends.
  --------------async click--------------
      updating a starts.
  app rendering starts.
  app rendering ends.
      updating a ends.
      updating b starts.
  app rendering starts.
  app rendering ends.
      updating b ends.
  </code></pre>
  <p>Is this a desired behavior?<br />
  How can I have a sync result in an async function?<br />
  I could not find any tips about this in official documents.<br />
  Any help would be appreciated.<br />
  Thanks!</p>