JavaScriptでfor...await...rangeを使用する方法

for await (const variable of iterable) {
  // 非同期処理
}

この文では、指定されたイテラブルオブジェクトを非同期に反復処理します。awaitキーワードを使用して、非同期処理が完了するのを待ちます。

以下に、for...await...range文の使用例を示します。

async function fetchData() {
  const data = [1, 2, 3, 4, 5];
  for await (const item of data) {
    const result = await asyncFunction(item);
    console.log(result);
  }
}
async function asyncFunction(item) {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(item * 2);
    }, 1000);
  });
}
fetchData();

この例では、fetchData関数内でdata配列を非同期に反復処理しています。各アイテムに対してasyncFunctionを呼び出し、結果をコンソールに表示しています。asyncFunctionは1秒待機してから、アイテムを2倍にして返します。

このように、for...await...range文を使用することで、非同期処理をシンプルに記述することができます。非同期イテレーションが必要な場合に便利な構文です。

この記事では、for...await...range文の基本的な使い方と一緒に、さまざまなシナリオでの応用例も紹介します。非同期処理をより効果的に行うためのヒントや注意点も解説します。