I am new to Javascript and unable to understand the Async/Await behaviour. I have read that Await is for Promises and should not affect non-promise items. But when I used Await with setTimeout it behaved differently.

async function foo() {
  console.log('FIrst');
  await setTimeout(()=>{console.log('timeout')},1000);
  console.log('Second');
} 
foo();
console.log('Three');

//Output is
//FIrst
//Three
//Second
//timeout

But when I remove await it gives

function foo() {
  console.log('FIrst');
  setTimeout(()=>{console.log('timeout')},1000);
  console.log('Second');
} 
foo();
console.log('Three');

//Output is
//FIrst
//Second
//Three
//timeout

So my question is in first code if it's actually waiting for settimeout to finish then why is it printing Second before timeout. Shouldn't it be timeout then Second

EDIT: Some comments say it is due to microtask Queue but can you explain the flow between callback queue and Microtask Queue.