Written by Kasumi

【JavaScript初心者向け】繰り返し処理を使い、配列要素を展開する方法

JavaScriptで繰り返し処理を使い、配列要素を展開する方法について知りたい。

本記事ではこのような悩みを解決。

JavaScriptのfor文、while文を使って配列要素を展開する方法について解説します。

for文を使って配列要素を展開

// 配列
var array = [1, 2, 3, 4, 5, 6];

// for文で展開
for (var i = 0; i < array.length; i++) {
  // コンソールに出力
  console.log(array[i]);
}

// 出力結果
// 1
// 2
// 3
// 4
// 5
// 6

for文を使った配列要素を展開するコード例です。

使い方は以下の通りです。

for (初期化式; 条件式; 変化式) {
実行処理
}

初期化式に変数 var i=0を定義。

条件式で変数iの値が配列の要素数(配列変数.length)より少なかったらを定義。

変化式でi++とし、iに繰り返し1を足していきます。

条件式が成り立つまで(iの値が配列の要素数より低い場合)繰り返し処理を行います。

実行処理で、配列変数[i]を指定する事により、配列要素をすべて展開できます。

while文を使って配列要素を展開

// 配列
var array = [1, 2, 3, 4, 5, 6];

// 初期値
var i = 0;

// while文で展開
while ( i < array.length ) {
  // コンソールに出力
  console.log(array[i]);
  i++;
}

// 出力結果
// 1
// 2
// 3
// 4
// 5
// 6

while文を使った配列要素を展開するコード例です。

使い方は以下の通りです。

while ( 条件式 ) {
実行処理
}

while文の前に、初期値0が入った変数iを定義。

条件式で、変数iが配列の要素数(配列変数.length)より少なかったらを定義。

実行処理内で配列変数[i]を指定、whileのループ終わり手前でi++を指定し条件式が成り立つまえ、iに1を足します。

以上で配列要素を展開できます。

まとめ

JavaScriptでfor文、while文を使い、配列要素を展開する方法について紹介しました。

以上で解説を終わります。

目次

関連記事

JavaScript

JavaScriptを使い、目次をプラグイン無しで自動生成する方法

2022.10.31
374
JavaScript

JavaScriptを使い、デバイス幅によって条件分岐する方法【jQuery不要】

2022.10.20
466
JavaScript

【JavaScript】スプレット構文(…)を使い、配列・オブジェクトを追加・連結(マージ)する方法

2022.12.04
419
JavaScript

JavaScriptで経過ミリ秒を取得。単位を秒・分に変換する方法

2023.01.19
168