Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

Javascript基礎知識#5(for文)

はじめに

この記事は私の脱コピペを目指すために書いている自分用のメモです。

※内容について、誤った知識やもっとわかりやすい表現等ございましたら、ご指摘いただけますと幸いです。

目次

  1. 繰り返し処理とは
  2. for文とは
  3. for文の書き方
  4. for文の例
  5. 配列を使った繰り返し処理
  6. continue
  7. break

1. 繰り返し処理とは

同じ処理を何回か繰り返したいときに使う処理。

繰り返し処理を使えば何回も同じコードを書かなくて済む。

2. for文とは

決められた回数だけ処理を繰り返す場合に使用します。
事前にどんな処理を何回繰り返すのかを決めておくのが一般的です。

3. for文の書き方

for文の基本形は下記のような感じです。

for ( カウンタ変数定義と初期化; 繰り返し回数の指定; カウンタ加算幅) {
  // 繰り返す処理を書く
}

for文は、3つの引数を与えてあげるのが一般的です。

1. カウンタ変数定義と初期化
今何回目の処理かをカウントするための変数定義。
i=0で初期化してね。

2. 繰り返し回数の指定
何回処理したいかを指定する。

3. カウンタ加算幅
i++と書くと、カウンタを1つづつ加算するという意味になる。

4. for文の例

for(let i = 0; i < 3; i++) {
  document.write('for文だよ');
}
結果
>> for文だよ
>> for文だよ
>> for文だよ

5. 配列を使った繰り返し処理

配列についての記事はこちら

forを使わないで配列の要素をすべて表示すると

let lists = ['山田', '伊藤', '佐藤', '鈴木'];

console.log ( lists[0] );
console.log ( lists[1] );
console.log ( lists[2] );
console.log ( lists[3] );
結果
1. 山田
2. 伊藤
3. 佐藤
4. 鈴木

console.log()を使って表示していますが、同じ処理を6回も繰り返して面倒臭いです。
保守性も低いです。

for文を使うと、、、

let lists = ['山田', '伊藤', '佐藤', '鈴木'];

for(let i = 0; i < lists.length; i++) {
  console.log( lists[i] );
}
結果
1. 山田
2. 伊藤
3. 佐藤
4. 鈴木

文が短いし、見やすいです。

6.continue: 特定のタイミングだけ処理を実行

continueを使うと、繰り返し処理の最中に特定のタイミングだけ処理を実行させないようにできる

for文を使って奇数だけを表示するよ

for(let i = 0; i > 10; i++) {
  if(i % 2 === 0) continue; //偶数(2で割れるとき)だけ処理しない
  console.log(i);
}
結果
1
3
5
7
9

7.break: 途中で処理を中断する

breakを使うと、繰り返しの途中で処理を中断できる

for(let i = 0; i > 10; i++) {
  if(i === 7) break; //7以降は中断
  console.log(i);
}
結果
1
2
3
4
5
6

こんな感じ。

nakanuxxx
プログラミング初学者による勉強した内容のまとめです
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away