Comment le code Javascript devient-il asynchrone lors de l'utilisation des rappels?

J'ai fait beaucoup de lecture en ligne en essayant de comprendre comment écrire du code JavaScript asynchrone. L'une des techniques qui est ressortie beaucoup de mes recherches consiste à utiliser les rappels. Bien que je comprenne le processus d'écriture et d'exécution d'une fonction de rappel, je ne comprends pas pourquoi les rappels semblent rendre automagiquement l'exécution JavaScript asynchrone. Donc, ma question est: comment l'ajout de fonctions de rappel à mon code JavaScript rend-il ce code asynchrone automatiquement?

Ce n'est pas le cas. Prendre un rappel ou passer un rappel ne signifie pas que c'est asynchrone.

Par exemple, la .forEachfonction prend un rappel mais est synchrone.

var available = false;
[1,2,3].forEach( function(){
    available = true;
});
//code here runs after the whole .forEach has run,
//so available === true here

Le setTimeoutprend également un rappel et est asynchrone.

function myFunction( fn ) {
    setTimeout( function() {
        fn(1,2,3);
    }, 0 );
}

var available = false;
myFunction( function() {
    available = true;
});
//available is never true here

Le raccordement à tout événement asynchrone en Javascript nécessite toujours un rappel, mais cela ne signifie pas que les fonctions d'appel ou leur transmission sont toujours asynchrones.

Le secret de la «magie» est que les événements auxquels vous attribuez les rappels sont asynchrones. Ils sont implémentés "sous le capot" pour s'occuper de tout ce qu'ils font (comme récupérer quelque chose d'un serveur distant) en arrière-plan, en dehors du sandbox JS. Et puis, une fois leur travail terminé, ils envoient au moteur JS un message pour appeler un événement. Lorsque le moteur JS a terminé ce qu'il fait actuellement, il appelle tous les événements mis en file d'attente (ou attend un nouveau message), puis votre rappel est "magiquement" appelé de manière asynchrone!

( REMARQUE: il s'agit d'un aperçu conceptuel de très haut niveau du sujet qui n'entre pas dans les détails, car différents moteurs JS vont implémenter les choses de différentes manières. Mais c'est l'idée générale de son fonctionnement.)