+9

JavaScriptでCallback関数をAsync/Awaitに変換する

JavaScriptでコールバック関数をAsync/Awaitに変換するには、次のようにします。

ステップ1:関数をasyncとして宣言する

awaitキーワードを関数内で使用するには、その関数をasyncとして宣言する必要があります。これは、関数定義の前にasyncキーワードを追加するだけです。例:

async function doSomething() {
// 関数本体
}

ステップ2:awaitキーワードを使用してプロミスを待つ

コールバック関数の代わりに、awaitキーワードを使用してプロミスが完了するのを待つことができます。プロミスは、非同期操作の最終的な成功または失敗を表すオブジェクトです。

これは、プロミスを使用してawaitを使用する方法の例です:

async function doSomething() {
  const result = await new Promise((resolve) => {
    // 非同期操作
    resolve(/* 非同期操作の結果 */);
  });
  // 非同期操作の結果をここで使用する
}

コールバック関数をAsync/Awaitに変換する

これは、コールバック関数をAsync/Awaitに変換する方法の例です:

// オリジナルのコールバック関数
function doSomething(num, callback) {
  setTimeout(function () {
    callback(num * 2);
  }, 1000);
}

// 変換されたAsync/Await関数
async function doSomething(num) {
  return new Promise((resolve) => {
    setTimeout(function () {
      resolve(num * 2);
    }, 1000);
  });
}

// 変換されたAsync/Await関数の使用
async function callDoSomething() {
  const result = await doSomething(5);
  console.log(result); // 10
}

変換されたAsync/Await関数は、オリジナルのコールバック関数よりもわかりやすく書けます。コールバックを使用する入れ子構文を使用する必要がなく、プロミスが完了するまで関数を一時停止するawaitキーワードを使用できます。

結論

コールバック関数をAsync/Awaitに変換することで、コードをより簡単に書けるようになり、理解しやすくなります。asyncキーワードとawaitキーワードを使用することで、通常のコードのように見える非同期コードを書けるようになり、デバッグが簡単になるでしょう。

Mình hy vọng bạn thích bài viết này và học thêm được điều gì đó mới.

Donate mình một ly cafe hoặc 1 cây bút bi để mình có thêm động lực cho ra nhiều bài viết hay và chất lượng hơn trong tương lai nhé. À mà nếu bạn có bất kỳ câu hỏi nào thì đừng ngại comment hoặc liên hệ mình qua: Zalo - 0374226770 hoặc Facebook. Mình xin cảm ơn.

Momo: NGUYỄN ANH TUẤN - 0374226770

TPBank: NGUYỄN ANH TUẤN - 0374226770 (hoặc 01681423001)

image.png


All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí