JavaScriptで指定した間隔で配列の要素を表示する方法


方法1: setIntervalを使用する方法

const array = [1, 2, 3, 4, 5];
let index = 0;
const intervalId = setInterval(() => {
  if (index < array.length) {
    console.log(array[index]);
    index++;
  } else {
    clearInterval(intervalId);
  }
}, 1000); // 1000ミリ秒ごとに要素を表示

上記のコードでは、setInterval関数を使用して、指定した間隔(ここでは1000ミリ秒)でコールバック関数が実行されます。コールバック関数内で、現在のインデックスに対応する配列の要素を表示し、インデックスをインクリメントします。配列の最後の要素を表示した後には、clearInterval関数を使用してインターバルを停止します。

方法2: setTimeoutを再帰的に使用する方法

const array = [1, 2, 3, 4, 5];
let index = 0;
function printArrayElement() {
  if (index < array.length) {
    console.log(array[index]);
    index++;
    setTimeout(printArrayElement, 1000); // 1000ミリ秒後に再帰的に関数を呼び出す
  }
}
printArrayElement();

上記のコードでは、再帰的な関数printArrayElementを定義し、配列の要素を表示します。関数内で、現在のインデックスに対応する配列の要素を表示し、インデックスをインクリメントします。その後、setTimeout関数を使用して、指定した間隔(ここでは1000ミリ秒)後に再帰的に関数を呼び出します。配列の要素をすべて表示した後、再帰呼び出しは停止します。