JavaScriptのConcurrenyモデル

この記事ではJavaScriptがどのように並行性を実装しているのか、そしてイベントループとは何かを見つけるつもりです.
だからまず最初に、JavaCrPitについて私たちが知っていることは、

シングルスレッドは2つの文を同時に実行できないことを意味します

一部のコードの実行を意味する非ブロッキングは、プログラムの実行を停止してはいけません.

非同期は、2つ以上のタスクを同時に行うことができることを意味します、

同時実行は、複数の計算を同時に行うことができます.

JavaScriptはシングルスレッドですので、どのようにして非同期でステートメントを実行しますか?
コード例

    console.log("Hello");
    setTimeout( () => {
        console.log("Hello inside setTimeout");
    }, 1000);
    console.log("Bye");

上記の文を実行した後、ブラウザは「hello」と「bye」を最初に印刷し、次に「こんにちはSetTimeoutの内部」を印刷します.
我々はイベントループを最初に学ぶ必要がある答えを見つけるために.

イベントループ可視化

fig :イメージsrc : freecodecamp.org
ヒープ:すべての変数のメモリ割り当てが行われる場所です.
スタック:これはすべてのJavaScriptコードがプッシュされ、行ごとに実行され、実行後にポップアウトされる場所です.JavaScriptは、このスタックのみを使用して実行コンテキストの順序を維持します.また、プログラムスタックまたは実行コンテキストスタックとして知られています.
コールバックキュー:これはすべての非同期コードが行く場所です.settimeout、setInterval、HTMLイベント、およびAjaxリクエストからのコールバック関数は、実行時にこのキューにプッシュされます.
イベントループ:イベントループの主な機能は、プログラムスタックをチェックし、空であるかどうかを確認することです.スタックが空の場合、コールバックキューをチェックします.コールバックキューが空でない場合、コールバックキューから主スタックへのコードブロックをプッシュし、順次実行します.
今は、上記のプログラムが実行されているときに起こっていることを理解しようとすることができます.

プログラムの実行が始まります.JavaScriptはシングルスレッドのみですので、1行ずつ実行できます.

したがって、コードの最初の行はスタックにプッシュされます.

コンソール.ログは「こんにちは」を出力します.したがって、この行は現在スタックからポップされます.

現在実行される次の行はsettimeoutであり、スタックにプッシュされます.今、JavaScriptランタイムは単一のステートメントを実行することができますが、ブラウザはWeb APIである他のものの全体の多くが付属しています.これは並行性が絵になる時です.SetTimeoutの実行では、settimeout APIへの呼び出しが行われ、settimeoutは現在スタックからポップされます.

3番目の文がスタックにプッシュされ、実行されます.これは出力として“bye”を出力する.

現在、SetTimeout API(および他のすべてのAPI)が完了すると、コールバックは同時にコールバックキューにプッシュされます.これらのAPIは直接スタックと対話できません.

今ではイベントのループが画像になる時間です.イベントループ仕事は、呼び出しスタックとタスク待ち行列をモニターすることです.呼び出しスタックが空の場合、コールバックキューから最初のものを取り、スタックにプッシュする必要があります.したがって、タイムアウトからのコールバックは、それから実行されるスタックに押されて、「settimeoutの中でHello」を印刷します.

運動時間

const promise = new Promise((resolve, reject) => {
  console.log(1);
  setTimeout(() => {
    console.log("timerStart");
    resolve("success");
    console.log("timerEnd");
  }, 0);
  console.log(2);
});
promise.then((res) => {
  console.log(res);
});
console.log(4);

上記のコードスニペットの出力は-
1
2
4
タイムスタート
ティームレット
成功
出力の簡単な説明
すべてのコンソールの最初の

.log ( 1 )は「1」を出力する.

setTimeoutが実行され、匿名関数がスタックされて実行されます.

その後、

コンソール."timerstart "を実行します.

このとき、Resolve ()はこのように約束を解決し、行66 - 68からの匿名関数はコールバックキューに追加されます.

その後、

コンソール.log ( 2 )が実行される.

その後、

コンソール.log ( 4 )がスタックされて実行される.

最後に、スタックが空の後、コールバックキューからの匿名関数がスタックされて実行されます.

イベントキューに関する重要な事実

すべての非同期コードは常にメインスタックコードの実行後に実行されます.

良いパートである

:あなたの現在の声明/機能は、完成に走ります.asyncコードは割り込みできません.あなたのasyncコードが実行されると、メインスタックが空になるのを待ちます.

いつイベントループを利用しますか？

あなたが連続的に必要でない重い計算をする必要があるとき、

.このような場合、メインスレッドをブロックしたくないでしょう.

他のすべての関数と文が実行された後、あるコードが実行されるとき.