【JavaScript】繰り返し処理の加算と減算(For)

投稿者: | 2021年2月11日
javascript_icon

今回はJavaScriptの繰り返し処理をしてくれるForについて解説していきます。

それではいってみましょう!

 

構文

For ([初期値]; [条件]; [インクリメント or デクリメント]){
処理;
}

 

for 文は、括弧で囲みセミコロンで区切った3つの引数と、続いてループ内で実行される文 (ふつうはブロック文) から成るループを構成します。

 

 

加算(インクリメント)の繰り返し

インクリメント書き方1

変数をForの中で設定したパターン

 

インクリメント書き方2

最初に変数を設定してからのパターン

 

【結果】

下記のように変数iが0から1回繰り返す度に1加算(プラス)され、9になるまで処理を実行します。

javascript_for_console

 

 

減算(デクリメント)の繰り返し

減算(デクリメント)書き方

【結果】

下記のように変数iがForで1回繰り返す度に-1減算(マイナス)され、0になるまで処理を実行します。

Forデクリメント

 

 

【応用】プルダウンメニューを作成

0~5までのプルダウンメニューを作成

 

【結果】

下記のようにForのインクリメントを使用して、連続した数値のプルダウンメニューが簡単に作成できます。

応用オプションボタン作成

 

まとめ

繰り返し処理のForは色々な場面で使用ができますので、この機会に簡単なのでマスターしちゃいましょう(^▽^)o

以上です。

 

【関連記事】

【JQuery】繰り返し処理(eachメソッド)