コールバック対約束

このブログでは、JavaScriptが非同期操作を処理するための基本概念を説明します.これらの概念は、コールバック関数、約束、およびasyncの使用を含み、JavaScriptで異なる操作を処理するのを待ちます.
つの比較にジャンプする前に、同期(ブロック)と非同期(非ブロック)の簡単な理解を得ましょう.

同期と非同期の違い
理解しやすくするために、非同期と同期の違いを説明する実際の例を見てみましょう.
私たちがレストランに行くと想像して、ウェイターはテーブルに来て、あなたの順序を取り、台所にそれを与える.プロセス全体をステップに分割する
ウェイターは、テーブル1 から注文を受けます

ウェイターは、料理242479182の料理を知らせる

テーブル2に料理を提供するか、表2

から注文をしてください
テーブルは、シェフが別のテーブルを提供する前に1つの食事を調理するのを待つ必要があります.これは非同期または非ブロッキングアーキテクチャと呼ばれます.ここでウェイターはハンドルのリクエストに割り当てられたスレッドのようです.それで、一つの糸は複数の要求を扱うのに用いられます.
非ブロッキングまたは非同期アーキテクチャとは対照的に、ブロッキングまたは同期アーキテクチャを有する.どのように動作してみましょう.だからレストランの例に戻ると、別のレストランに行くと想像して、このレストランでは、ウェイターが割り当てられます.彼はあなたの注文を取り、それを台所に与える.今、彼はシェフがあなたの食事を準備するのを待っている台所で座っています、そして、今度は、彼がちょうどあなたが彼の食事が準備ができているまで、彼がもう一つのテーブルからどんな順序でも取るつもりでないということを待っている他の何もしていません.これは同期またはブロッキングアーキテクチャと呼ばれます.
さて、最初のレストランの例では、待機する必要がないので、非同期処理を表します.ウェイターは、1つのテーブルから順番を取り、次のテーブルに移動して順番を取ります.番目の例レストランは同期操作を表しますが、リソース(この場合のウェイター)があなたと一緒に進むまで待つ必要がありました.これはsyncとasyncの間の単一の、最も基本的な違いです.
JavaScriptの非同期コードを扱う方法は様々です.これらはコールバック、約束、およびasync/waitです.

コールバック
JavaScriptでは、関数はオブジェクトであるため、オブジェクトをパラメーターとして関数に渡すことができます.
コールバック関数の例を挙げましょう.

function printString(){
   console.log("Jay"); 
   setTimeout(function()  { console.log("Jeevan"); }, 500); 
   console.log("Joy")
}

printString();

それが同期コードであるならば、我々は以下の出力に遭遇しました.

Jay
Jeevan
Joy

しかし、settimeoutはasync関数である.

Jay
Joy
Jeevan

JavaScriptの組み込みメソッドは“settimeout”と呼ばれ、指定された時間(ミリ秒単位)後に関数を呼び出します.
言い換えると、メッセージ機能は何かが起こった後に呼ばれています(この例のために5秒経過した後に)、しかし、前にでなく.

約束:
JavaScriptの約束は、実際の生活の中で約束することができます.私たちが実生活で約束をするとき、約束は未来のために作られるだけであるので、我々は将来何かをするつもりです.
約束は2つの可能な結果があります:あなたの約束を守るかどうか.
JavaScriptで同じ約束の基本が適用されます.JavaScriptで約束を定義するときは、時間が来たときに解決されます.
約束は、操作の非同期結果を処理するために使用されます.JavaScriptは、コードの他の同期部分が実行できる前に、コードの非同期ブロックを完全に実行するのを待つように設計されています.約束で、asyncリクエストが完了するまでコードブロックの実行を延期できます.このようにして、他の操作は割り込みなしで実行できます.
約束の状態
まず第一に、約束は目的です.約束オブジェクトの3つの状態があります.
保留中の

:初期状態.

解決される

:見込み見込み

は拒絶しました:失敗した見込み、エラー

を投げてください
例えば、我々が約束を使用することによってサーバーからデータを要求するとき、我々が我々のデータを受け取るまで、それは保留状態にあります.
我々がサーバーから情報を得るならば、約束は首尾よく解決されます、しかし、我々が情報を得ないならば、約束は拒絶された状態にあります.
約束の作成
まず、コンストラクタを使用してPromiseオブジェクトを作成します.成功には2つのパラメータがあります.成功(解決)と失敗( reject ):

const myFirstPromise = new Promise((resolve, reject) => { 
    const condition = true;   
    if(condition) {
         setTimeout(function(){
             resolve("Promise is resolved!"); 
        }, 500);
    } else {    
        reject('Promise is rejected!');  
    }
});

条件がtrueであるならば、上記の約束で、「約束は解決されます」というリターンを解決することを決意します.今、我々は我々の最初の約束を作成しました.
約束の使用
上記のCREATE Promiseを使用するために、解決のためにthen()と拒絶のためにcatch()を使います.

myFirstPromise
.then((successMsg) => {
    console.log(successMsg);
})
.catch((errorMsg) => { 
    console.log(errorMsg);
});

これをさらに進めましょう.

const demoPromise= function() {
  myFirstPromise
  .then((successMsg) => {
      console.log("Success:" + successMsg);
  })
  .catch((errorMsg) => { 
      console.log("Error:" + errorMsg);
  })
}

demoPromise();

作成した約束条件は"true "であり、demopromise ()を呼び出します.

Success: Promise is resolved!

それで、約束が拒絶されるならば、それはcatch()メソッドにジャンプします、そして、今度は、我々はコンソールに異なるメッセージを見ます.

Error: Promise is rejected!

async/wait :
待つことは約束のために基本的に構文上の砂糖です.それはあなたの非同期コードを同期/手続きのコードのように見えます.
asyncとwaitの構文

async function printMyAsync(){
  await printString("one")
  await printString("two")
  await printString("three")
}

「非同期」キーワードをラッパー関数PrintMyAsyncに使うことができます.これにより、JavaScriptはAsync/Waitの構文を使用していることを知っています.待ち受けているのは、async関数でのみ使用することです.
AWAITキーワードは、Async関数で返されるすべての約束を同期させるために、async関数で使用されます.待ってコールバックの使用を排除します.パラメータ()およびcatch ()asyncとwaitを使って、約束を返すとき、asyncはprependedされて、約束を呼ぶとき、待ちます.tryとcatchはまた、async関数の拒否値を取得するために使用されます.
非同期を理解して、我々の行き詰まりで待つ例を挙げましょう.

const helloPromise = function() {
  return new Promise(function(resolve, reject) {
    const message = "Hi, How are you!";

    resolve(message)
  });
}


async function demoPromise() {
  try {
    let message  = await helloPromise();
    console.log(message);

  }
  catch(error){ 
      console.log("Error:" + error.message);
  }
}

demoPromise();

結論
私たちのユースケースに基づいて、我々はこのアプローチのいずれかを好むことができます.Async/Waitは約束の上にラップされているので、すべての約束関連の機能がサポートされています.したがって、コールバックを約束と比較すると、コールバックよりも約束が動きます.それらの少数をリストすること;

キャッチブロック

を使用した単一エラー伝搬

は、約束連鎖またはasync/wait/

を使用しているコールバック地獄を克服します

はPromise.all()を使用して並列処理を実装します.

Promiseは(race(), allSettled() and any())のような他のいくつかの静的メソッドをサポートします.

この物語がJavascriptの非同期処理概念をリフレッシュするのを助けてくれることを願っています.ご意見、ご提案やクエリを共有すること自由に感じなさい.