JavaScriptの非同期プログラミングについて詳しく説明します。

非同期の概念
非同期（Aynch ronous，async）は同期（Synch ronous，sync）に対する概念である。
我々が学習している従来のシングルスレッドプログラムでは、プログラムの実行は同期されている（同期はすべてのステップが同時に実行されることを意味するのではなく、ステップが1つの制御ストリームシーケンスで順次実行されることを意味する）。非同期の概念は、同期を保証しないということです。すなわち、非同期プロセスの実行は、既存のシーケンスと順序関係がなくなります。
簡単に理解すると、同期はあなたのコード順に実行します。非同期はコード順に実行しません。非同期の実行効果はより高いです。
以上は非同期の概念について説明したが、次に非同期を簡単に説明する。非同期とは、主スレッドからサブスレッドを送信してタスクを完了することである。

いつ非同期でプログラミングしますか？
フロントエンドプログラミングにおいては（バックエンドでもそうである場合があります。）簡単で高速な操作を行う場合、例えば1＋1を計算した結果は、メインスレッドの中でよく行われます。メインスレッドはスレッドとして、多面的な要求を同時に受けることができません。したがって、一つのイベントが終了しないと、他の要求を処理できなくなります。
今はボタンがありますが、もし私たちがそのイベントを死のサイクルに設定したら、このボタンを押すと、全ページの応答がなくなります。
このような状況を回避するために、私たちはしばしば、大きなファイルを読み込むか、またはネットワーク要求を送信するかのような、ユーザによって知覚されるまでの時間が十分にかかる可能性があるいくつかのスレッドを使用する。サブスレッドはメインスレッドから独立しているので、ブロッキングがあってもメインスレッドの動作には影響しません。しかし、子スレッドには制限があります。一度発射したら、メインスレッドと同期が取れなくなります。終わったら、いくつかのことを処理する必要があります。例えば、サーバーからの情報を処理しても、メインスレッドに統合することはできません。
この問題を解決するためには、JavaScriptにおける非同期動作関数は、しばしばフィードバック関数によって非同期タスクの結果処理を実現する。
コールバック関数
コールバック関数は、私たちが非同期のタスクを起動するときに、それを教えてくれます。このタスクが完了したら、何をしますか？このようにメインスレッドは、非同期タスクの状態にほとんど関心がなく、彼自身が有終の美を発揮します。
実例

function print() {
 document.getElementById("demo").innerHTML="JB51!";
}
setTimeout(print, 3000);

効果図

このプログラムのsetTimeoutは、長い（3秒）時間を消費するプロセスであり、その最初のパラメータは、フィードバック関数であり、2番目のパラメータはミリ秒であり、この関数が実行されると、サブスレッドが生成され、3秒待ちの後、コールバック関数「print」が実行され、コマンドラインで「Time out」が出力される。
もちろん、JavaScript文法はとても友好的です。単独で関数printを定義する必要はありません。上記の手順をよく書きます。

setTimeout(function () {
 document.getElementById("demo").innerHTML="JB51!";
}, 3000);

注意：setTimeoutはサブスレッドで3秒待ちますが、setTimeout関数の実行後にメインスレッドが停止していないので、

setTimeout(function () {
 console.log("1");
}, 1000);
console.log("2");

このプログラムの実行結果は：
2
1
非同期AJAX
setTimeout関数を除いて，非同期ループはAJAXプログラミングに広く適用されている。AJAXについて詳しくは、https://www.jb51.net/article/80686.htmを参照してください。
XMLHttpRequestは、リモートサーバからのXMLまたはJSONデータを要求するためによく使われる。一つの標準XMLtpRequestオブジェクトはしばしば複数のフィードバックを含む。

var xhr = new XMLHttpRequest();
 
xhr.onload = function () {
 //           
 document.getElementById("demo").innerHTML=xhr.responseText;
}
 
xhr.onerror = function () {
 document.getElementById("demo").innerHTML="    ";
}
 
//      GET   
xhr.open("GET", "https://www.runoob.com/try/ajax/ajax_info.txt", true);
xhr.send();

XMLHttpRequestのonloadとoneerror属性はすべて関数で、それぞれ成功と要求失敗の時に呼び出されます。完全なjQueryライブラリを使用すれば、異歩AJAXをより優雅に使用することもできます。

$.get("https://www.runoob.com/try/ajax/demo_test.php",function(data,status){
 alert("  : " + data + "
  : " + status);
});

以上はJavaScriptの非同期プログラムの詳細を詳しく説明しました。JavaScriptの非同期プログラムに関する資料は他の関連記事に注目してください。