制御構文とは？
普通プログラムは記述された順番で処理を実行するものですが、実際にはユーザーの入力や操作によって処理を分岐させる必要があります(例えば、1000円以上買うと10%オフ、それ未満は割引なし)。
JavaScriptでは、このように処理を分岐するための制御構文がいくつか用意されています。本日はそれらについて書こうと思います。
if文
名前の通り「もし〜なら、〜する」という処理を行う構文です。
実際に書いてみます。
if(条件式){
条件式がtrueの場合に実行する命令
}else{
条件式がfalseの場合に実行する命令
}
上記が基本的な書き方になります。ここではelseを書いていますが、trueの場合にしか処理を実行したくない場合はelseはなくても大丈夫です。
しかし条件式が一つしか書けないのなら、あまり汎用性がありません。でも大丈夫です。条件式は複数書くことができます。以下の書き方をみてみましょう。
if(条件式1){
条件式1がtrueの場合に実行する命令
}else if(条件式2){
条件式2がtrueの場合に実行する命令
}
...
}else{
全ての条件式がfalseの場合に実行する命令
}
上記のようにif else(条件式n)を使えば必要となる分岐の数だけ列記できます。
では実際に条件式を書いて挙動を確認しましょう。
var age = 10; //変数を定義
if (x >= 10) {
console.log("私の年齢は10歳以上です");
} else {
console.log("私の年齢は10歳未満です");
} //result: 私の年齢は10歳以上です
もし変数ageが10未満の場合はelse以降の命令が実行されます。
次に複数の条件式を書いてみましょう。
var x = 30;
if (x >= 20) {
console.log("xは20以上です");
}else if (x >= 10) {
console.log("xは10以上です");
} else {
console.log("xは10未満です");
} //result: xは20以上です
ちょっとこれはおかしいですね。x>=20 とx>=10はどちらとも条件に適合しています。しかしx>=20の時の処理しか実行されていません。しかししかしこれは正しい挙動です。説明するとif文は、複数の条件に合致する場合でも実行されるのは最初の1つだけなのです。なのでif文は条件に合致する条件を見つけると以下の条件に目を通すことなくif文を終了してしまうというわけです。
for文
この構文は指定された回数だけ繰り返し処理を行う構文です。
実際に書いてみます。
for (初期化式; ループ継続条件式; 増減式) {
ループ内で実行する命令
}
なんだかよくわかりませんね。まあ、実際に条件式に実際の値を入れて確認してみましょう。
for (var x=8; x < 10; x++) {
console.log("xの値は" + x);
} //result: xの値は8, xの値は９
説明していきます。まず初期化式でx=8と定義しています。最初のループだけこの初期化式が実行されます。よって最初のループではx=8なのでループの条件式にも適合し命令が実行されます。次に2回目のループです。2回目以降では初期化式は実行されません。よって現在のxの値に+1(x++)されx=9となります。9はループ継続条件に適合しているので命令が実行されます。続いて3回目のループですが現在のxの値(9)に+1するとx=10となります。ループ条件式をみてみるとx<10となっています。よってループ継続条件式の条件に外れてしまいます。ここでループが終了します。
for文を用いて配列を順番に取り出してみる
実際にコードを書きます。
var data = ['apple','orange','banana'] //配列
for(var i=0; i < data.length; i++){
console.log(data[i]);
}
先ほど行ったfor文と違うところはループ条件式ですね。i<data.lengthはどういうことなのでしょうか？配列にはインデックス番号というものが割り振られています。上記の配列は0,1,2のインデックス番号が割り振られています。(0から始まるので注意。)上記コードのconsole.logをみてみるとiがインデックス番号を示していることがわかると思います。これを踏まえてもう一度ループ条件式をみてみるとなんとなくわかると思いますが、data.lengthは配列の長さ?を示しています。つまりi<3ということです。よってインデックス番号が0~2までループされるので配列の中身は順に出力されます。
最後に
HUNTERxHUNTERはよ連載してくれ