JavaScript est monothread et possède un modèle d'exécution synchrone. Un thread unique signifie qu'une seule commande est exécutée à la fois. Synchrone signifie une à la fois, c'est-à-dire qu'une ligne de code est exécutée à la fois afin que le code apparaisse. Donc, en JavaScript, une chose se produit à la fois.
Contexte d'exécution
Le moteur JavaScript interagit avec les autres moteurs du navigateur. Dans la pile d'exécution JavaScript, il y a un contexte global en bas, puis lorsque nous invoquons des fonctions, le moteur JavaScript crée de nouveaux contextes d'exécution pour les fonctions respectives. Lorsque la fonction appelée quitte son contexte d'exécution est extrait de la pile, puis le contexte d'exécution suivant est extrait et ainsi de suite ...
Par exemple
function abc()
{
console.log('abc');
}
function xyz()
{
abc()
console.log('xyz');
}
var one = 1;
xyz();
Dans le code ci-dessus, un contexte d'exécution global sera créé et dans ce contexte var one sera stocké et sa valeur sera 1 ... lorsque l'invocation xyz () est appelée, un nouveau contexte d'exécution sera créé et si nous avions défini une variable dans la fonction xyz, ces variables seraient stockées dans le contexte d'exécution de xyz (). Dans la fonction xyz, nous invoquons abc () puis le contexte d'exécution abc () est créé et placé sur la pile d'exécution ... Maintenant, lorsque abc () termine, son contexte est extrait de la pile, puis le contexte xyz () est extrait de pile et puis le contexte global sera sauté ...
Maintenant sur les rappels asynchrones; asynchrone signifie plus d'un à la fois.
Tout comme la pile d'exécution, il y a la file d'attente d'événements . Lorsque nous voulons être informés d'un événement dans le moteur JavaScript, nous pouvons l'écouter et cet événement est placé dans la file d'attente. Par exemple, un événement de demande Ajax ou un événement de demande HTTP.
Chaque fois que la pile d'exécution est vide, comme illustré dans l'exemple de code ci-dessus, le moteur JavaScript examine périodiquement la file d'attente des événements et voit s'il y a un événement à notifier. Par exemple, dans la file d'attente, il y avait deux événements, une demande ajax et une demande HTTP. Il cherche également à voir s'il existe une fonction qui doit être exécutée sur ce déclencheur d'événement ... Le moteur JavaScript est donc informé de l'événement et connaît la fonction respective à exécuter sur cet événement ... Le moteur JavaScript appelle donc le fonction de gestionnaire, dans le cas d'exemple, par exemple AjaxHandler () sera invoqué et comme toujours quand une fonction est invoquée son contexte d'exécution est placé sur le contexte d'exécution et maintenant l'exécution de la fonction se termine et la requête ajax d'événement est également supprimée de la file d'attente d'événements ... Une fois AjaxHandler () terminé, la pile d'exécution est vide, de sorte que le moteur examine à nouveau la file d'attente d'événements et exécute la fonction de gestionnaire d'événements de la requête HTTP qui se trouvait ensuite dans la file d'attente. Il est important de se rappeler que la file d'attente d'événements n'est traitée que lorsque la pile d'exécution est vide.
Par exemple, voir le code ci-dessous expliquant la pile d'exécution et la gestion de la file d'attente d'événements par le moteur Javascript.
function waitfunction() {
var a = 5000 + new Date().getTime();
while (new Date() < a){}
console.log('waitfunction() context will be popped after this line');
}
function clickHandler() {
console.log('click event handler...');
}
document.addEventListener('click', clickHandler);
waitfunction(); //a new context for this function is created and placed on the execution stack
console.log('global context will be popped after this line');
Et
<html>
<head>
</head>
<body>
<script src="program.js"></script>
</body>
</html>
Maintenant, lancez la page Web et cliquez sur la page, et voyez la sortie sur la console. La sortie sera
waitfunction() context will be popped after this line
global context will be emptied after this line
click event handler...
Le moteur JavaScript exécute le code de manière synchrone comme expliqué dans la partie contexte d'exécution, le navigateur place les choses de manière asynchrone dans la file d'attente des événements. Ainsi, les fonctions qui prennent très longtemps à s'achever peuvent interrompre la gestion des événements. Les choses qui se passent dans un navigateur comme les événements sont gérées de cette façon par JavaScript, s'il y a un écouteur censé s'exécuter, le moteur l'exécutera lorsque la pile d'exécution sera vide. Et les événements sont traités dans l'ordre où ils se produisent, donc la partie asynchrone concerne ce qui se passe en dehors du moteur, c'est-à-dire ce que le moteur doit faire lorsque ces événements extérieurs se produisent.
JavaScript est donc toujours synchrone.
