Programmazione asincrona in JavaScript

Questo aspetto si occupa della gestione dell’esecuzione del codice. Il programma JavaScript viene eseguito tutto in un’unica successione di esecuzioni: in termini tecnici, questa cosa viene definita a filo unico, ovvero single-threaded. 

Tutte le operazioni, dall’elaborazione dell’input dell’utente alla visualizzazione del risultato sulla pagina web, sono affidate a questo singolo thread, che scandisce i tempi. L’esecuzione è, quindi, detta sincrona.
Per molti impieghi, la sincronia non è un buon modo di eseguire il software. Infatti, le operazioni del software vengono eseguite una dopo l’altra, per cui se alcune richiedono elaborazioni lunghe o bloccate, il resto del programma aspetta il suo turno e, quindi, è cieco e sordo.

Per questo motivo, nel linguaggio JavaScript si utilizza la programmazione asincrona: alcune funzioni vengono gestite al di fuori del single thread, in modo da evitare blocchi o altri problemi.

Sono esempi di funzioni asincrone setTimeout() o fetch().
Inoltre, ECMAScript 2017 (ES8) async/await permette di scrivere codice asincrono in modo sincrono e più leggibile.

Un simpatico esempio postato da Brian Barbour può aiutarti ad entrare nel mondo asincrono. Esegui nella console questo codice:

console.log("primo")
console.log("secondo")
console.log("terzo")

L’esecuzione porta alla stampa di

primo

secondo

terzo

In rapida successione. Ignora la scritta “undefined”: è una comunicazione di controllo della quale puoi non preoccuparti.

Prova, invece, ad inserire un’attesa di 1000 unità di tempo, ovvero millisecondi, per un totale di 1 secondo.

console.log("primo")

setTimeout(() => {
  console.log("secondo")
}, 1000)

console.log("terzo")

Ritardare la stampa del secondo nome non ritarda l’esecuzione di ciò che viene dopo: si stampa “primo”, si ritarda di 1s la stampa di “secondo” e quindi si stampa “terzo”. La stampa di “terzo” richiede meno di 1s, per cui la stampa complessiva di questo programma sarà:

primo

terzo

secondo.