Codice Asincrono con Callback in JavaScript

Supponiamo di avere una funzione asincrona:

function make() {
	setTimeout(function() {
		console.log('1');
	}, 3000);
}

Supponiamo di utilizzare questa funzione nel seguente modo:

make();
console.log('2'); // verrà eseguito per primo

Supponiamo di voler fare in modo che la seconda stampa in console venga eseguita dopo che l'operazione asincrona all'interno della funzione è completata. Uno degli approcci utilizzati per questo scopo è l'uso di una callback: incapsuliamo il codice in attesa in una funzione anonima e la passiamo come parametro alla funzione make:

make(function() {
	console.log('2');
});

Naturalmente, di per sé, questo non risolve il nostro problema. Per ora abbiamo semplicemente stabilito questa convenzione: se desideri eseguire del codice dopo che make viene attivata, passa quel codice come callback alla chiamata di make.

Modifichiamo il codice della funzione make in modo che inizi a funzionare secondo la nostra convenzione:

function make(callback) {
	setTimeout(function() {
		console.log('1'); // qualche operazione asincrona, potrebbe non essere una sola
		callback();       // poi la nostra callback
	}, 3000);
}

Spiega in quale ordine i numeri verranno stampati in console:

function make(callback) {
	setTimeout(function() {
		console.log('1');
		callback();
	}, 3000);
}

make(function() {
	console.log('2');
	console.log('3');
});