if文

if文を用いると、特定の条件下のみで実行されるプログラムを記述することができます。

基本構造

const age = 18;
if (age >= 20) {
document.write('大人です。');
} else {
document.write('子供です。');
}

2行目のif (age >= 20) {の部分に差し掛かると、まずは括弧内のage >= 20が評価されます。この式の値はfalseなので、

if (false) {
document.write('大人です。');
} else {
document.write('子供です。');
}

if文の基本構造は

if (式) 文1 else 文2

です。式の値がtrueであれば文1が、falseであれば文2が実行されます。よって、上記の例では子供です。が表示されます。

なお、elseと文2は省略することもできます。

tip

{から}で囲まれた部分のことをブロックと呼び、複数の文をグループ化することができます。上の例では文は1つずつなのでこの括弧は必要ありませんが、複数の文を入れる場合は必ず必要になります。

ブロックを作る場合は、適切にインデント（字下げ）を行いましょう。上の例では、2行目と4行目のみが、他の部分と比べスペース2文字分だけ下がっていることが分かります。

ネストされたif文とelse if

制御構造は、入れ子（ネスト）にすることで、より複雑な処理を記述できます。

const age = 19;
if (age >= 20) {
document.write('入場できます。');
} else {
if (age >= 18) {
document.write('条件付きで入場できます。');
} else {
document.write('入場できません。');
}
}

以上の例では、ageが

  • 20以上であれば、入場できます。と表示
  • 18以上であれば、条件付きで入場できます。と表示
  • それ以外であれば、入場できません。と表示

という形になっています。ただし、この場合、外側のelseに続く括弧内の文はif文ひとつのみですので、括弧を省略して

const age = 19;
if (age >= 20) {
document.write('入場できます。');
} else if (age >= 18) {
document.write('条件付きで入場できます。');
} else {
document.write('入場できません。');
}

のようにする場合が多いです。

truthyとfalsy

次のコードの実行結果はどうなるでしょうか。

if ('Hello World!') {
document.write('trueです。');
} else {
document.write('falseです。');
}

JavaScriptでは次のような値は、論理演算においてfalseと同様に扱われます。

  • 0 (数値)
  • '' (空文字列)

などです。このような値をfalsyな値であるといいます。falsyでない値はすべてtrueと同様、すなわちtruthyな値です。よって、上の例ではtrueです。が表示されます。

課題

生まれた年を格納した変数を予め用意し、その年がうるう年かどうかを判定して表示するプログラムを作成してください。ただし、うるう年とは、西暦年が以下のいずれかの条件を満たす年であるものとします。

  • 400で割り切れる
  • 100で割り切れないが、4で割り切れる
tip

%は剰余演算子と呼ばれ、除算の剰余を求めることができます。

Edit this page