JavaScript non ha una funzione sleep, ma possiamo risolvere facilmente così!

Per far "dormire" il browser, ti basta scrivere questa riga di codice:

await new Promise((_) => setTimeout(_, 2000));

Questo farà dormire il browser per 2 secondi (2000ms).

Nota: funziona solo nei browser moderni (> 2017)! Vedi la compatibilità di await su caniuse.com.

Creiamo una funzione sleep riutilizzabile

const sleep = (ms = 2000) => new Promise((_) => setTimeout(_, ms));

Oppure con una sintassi più "vecchia scuola":

function sleep(ms = 2000) {
  return new Promise(function (_) {
    return setTimeout(_, ms);
  });
}

Se vuoi esplorare altre funzionalità di Promise, puoi consultare la documentazione MDN.

Come usarla

console.log(`Let's wait for 5s`);

await sleep(5000); // 5000ms = 5seconds

console.log(`5s have passed`);

Risultato in console:

> Let's wait for 5s
[waiting for 5 seconds]
> 5s have passed

Problema del top-level await

Usare top-level await potrebbe non funzionare in alcune versioni vecchie di browser/node. Per risolvere possiamo wrappare il codice in una immediately-invoked async function.

(async function () {
  console.log(`Let's wait for 5s`);

  await sleep(5000);

  console.log(`5s have passed`);
})();

Sleep function nei browser vecchi

Solo come nota: in passato la funzione sleep veniva spesso scritta così, ma non è per niente "performance friendly".

function sleep(mss) {
  const date = Date.now();
  let currentDate = null;
  do {
    currentDate = Date.now();
  } while (currentDate - date < milliseconds);
}

Demo

Ho creato un progetto stackblitz con un esempio semplice.