こんにちは、カメ助(@kamesuke_blog)です。
今回は、JavaScriptのfor文(繰り返し処理)の使い方について、実際の業務で使用頻度が高いソースコードを例に解説していきます。皆さんの業務や課題解決にご活用ください。
カメ助JavaScriptのfor文の使用方法についてイメージできるようになるよ
目次
for文(繰り返し処理)のサンプル
基本：配列の中身を順番に出力する
|
1 2 3 4 5 |
//配列の中身を順番に出力する let lists = ['1番目','2番目','3番目'];//配列に値をセット for(let i = 0; i < lists.length; i++){ console.log(lists[i]); //コンソールに配列に入っている文字列を出力する } |
|
1 2 3 4 |
//出力結果 1番目 2番目 3番目 |
配列listsの各要素を順番に処理し、中身の値を出力するプログラムです。上記は、最も基本的なfor文の使用例なので覚えておきましょう。
繰り返し回数に、「lists.length」で配列の要素数を設定し、配列の要素数だけ繰り返し処理をしています。
九九の計算を行う
|
1 2 3 4 5 6 |
//九九の計算を行う for(let i=1;i<=9;i++){ for(let j=1;j<=9;j++){ console.log(i+'×'+j+'='+i*j) } } |
|
1 2 3 4 5 6 7 8 |
//出力結果 1×1=1 1×2=2 1×3=3 … 9×7=63 9×8=72 9×9=81 |
九九の計算を行うプログラムです。for文を入れ子(ネスト)にすることで実現しています。処理の流れとしては、「変数i」が1~9まで順に増加していくその中で「変数j」を1~9まで増加させ、その積を出力しています。
条件式に使用する比較演算子
for文の条件式に使用する比較演算子の一覧です。for文を使用する際に確認することが多いと思うので記載しておきます。
| 演算子 | 意味 | 備考 |
|---|---|---|
| > | より大きい | |
| >= | 以上 | |
| < | より小さい | |
| <= | 以下 | アロー関数「=>」と間違えないように注意 |
| == | 等しい | データ型については比較対象外 |
| != | 等しくない | データ型については比較対象外 |
| === | 値が等しい、かつデータ型も等しい | |
| !== | 値が等しくない、またはデータ型が異なる |
カメ助「=>」はアロー関数という別のものを指すので注意しましょう！
おまけ
for文(繰り返し処理)の書き方・利用シーンについて解説しますので、時間がある方はご覧ください。
for文(繰り返し処理)の書き方
for文(繰り返し処理)の基本構文は下記の通りです。
|
1 2 3 4 |
//JavaScriptのfor文(繰り返し処理) for ( [①初期化式]; [②条件式]; [③加算式]){ ④[条件が真(true)の場合に実行される処理] } |
for文(繰り返し処理)の利用シーン
カメ助for文(繰り返し処理)を使用すると、『ソースコード量を減らす』、『プログラム修正時に修正箇所を減らす』メリットがあるよ。
以上、for文(繰り返し処理)のサンプル例についての紹介でした。積極的にfor文を使っていきましょう!
PS：こんなサンプルコードが欲しい、などありましたらコメントください。
その他
forEach文のサンプルはこちらの記事を参考にしてください。
【JavaScript入門】forEach文を使ったサンプル例
リンク
コメント
コメント一覧 （1件）
[…] ＞＞for文を使ったサンプルはこちら […]