JavaScriptの非同期実行と動作フロー制御例を詳しく解説

1. Javascript 言語の実行環境は「シングルスレッド」です。

利点: 実装が比較的簡単で、実行環境も比較的シンプルです。

欠点: 1 つのタスクに時間がかかる限り、後続のすべてのタスクがタスクは列に並んで待機する必要があります。プログラム全体の実行が遅れます。一般的なブラウザの応答不能 (サスペンドデス) は、特定の Javascript コードが長時間実行される (無限ループなど) ことが原因で発生することが多く、その結果、ページ全体がその場所でスタックし、他のタスクが実行できなくなります。

この問題を解決するために、JavaScript言語ではタスクの実行モードを同期(Synchronous)と非同期(Asynchronous)の2種類に分けています。

2. 「非同期モード」プログラミングのいくつかの方法:

(1) コールバック関数: 利点は、シンプルで理解しやすく、展開しやすいことですが、欠点は、コードの読み取りと保守に役立たないことです。 、さまざまな部分が高度に結合 (カップリング) されているため、プログラム構造が混乱し、プロセスの追跡が困難になります (特にコールバック関数がネストされている場合)。各タスクに指定できるコールバック関数は 1 つだけです。

(2) イベント駆動型モード (イベント リスニング) を採用する: 利点は、理解しやすく、複数のイベントをバインドでき、各イベントが複数のコールバック関数を指定でき、「分離」 (デカップリング) できることです。モジュール式の実装に有益です。欠点は、プログラム全体をイベント駆動型にする必要があり、実行プロセスが非常に不明確になることです。

(3) オブザーバー パターン (パブリッシュ/サブスクライブ パターン): このメソッドの性質は「イベント リスニング」に似ていますが、後者よりも大幅に優れています。なぜなら、「メッセージ センター」を見て、存在するシグナルの数と各シグナルの加入者数を確認することで、プログラムの動作を監視できるからです。

3. 非同期操作のプロセス制御。

(1) シリアル実行: プロセス制御関数を作成し、1 つのタスクが完了した後、別のタスクを実行します。

var items = [ 1, 2, 3, 4, 5, 6 ];
var results = [];
function series(item) {
 if(item) {
  async( item, function(result) {
   results.push(result);
   return series(items.shift());
  });
 } else {
  return final(results);
 }
}
series(items.shift());

関数シリーズは、非同期タスクを順番に実行します。すべてのタスクが完了するまで、最後の関数は実行されません。 items 配列には各非同期タスクのパラメーターが格納され、results 配列には各非同期タスクの実行結果が格納されます。

(2) 並列実行: すべての非同期タスクが同時に実行され、すべてが完了するまで最後の関数は実行されません。

//forEach方法会同时发起6个异步任务，等到它们全部完成以后，才会执行final函数。
var items = [ 1, 2, 3, 4, 5, 6 ];
var results = [];

items.forEach(function(item) {
 async(item, function(result){
  results.push(result);
  if(results.length == items.length) {
   final(results);
  }
 })
});

並列実行の利点は、一度に 1 つのタスクしか実行できないシリアル実行と比較して、時間が節約されることです。しかし、並列タスクが多いとシステムリソースが枯渇しやすく、動作速度が遅くなるという問題があります。そこで、プロセス制御には第 3 の方法があります。

(3) 並列と直列の組み合わせ: しきい値を設定し、一度に最大 n 個の非同期タスクのみを並列実行できます。これにより、システム リソースの過剰な使用が回避されます。

りー

以上がJavaScriptの非同期実行と動作フロー制御例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。