if～else文JavaScript入門

if～else文の記述の仕方

if～elseの構文は、以下のように記述します。

if ( 条件式 ){ 処理1 } else { 処理2 }

条件式に合致している場合、処理1を実行します

条件式に合致しない場合、処理2を実行します

記述の仕方は上記の通りです。条件式に合っていれば処理1を、合っていなければ処理2が実行されます。 このようにして、条件により処理を分岐させることができます。

簡単なサンプルを見てみましょう。以下のように記述してみました。何と表示されるでしょうか？

<script>

var num = 5;

if ( num < 3 )
{
  alert("３より小さいです。");
}
else
{
  alert("３より大きいです。");
}
</script>

サンプル（別窓）

答えは「３より大きいです。」となります。変数numには5が入っているので、条件式「 n < 3 」には当てはまりません。 その結果、else以下の処理が行なわれる訳です。

if～elseを重ねる

if～else文を重ね合わせて、何重にも処理を分岐させることもできます。以下のサンプルをご覧下さい。

<script>
var num = 5;

if ( num == 3 )
{
    alert( "3が入っています。" );
}
else
{
    if ( num == 4 )
    {
        alert( "4が入っています。" );
    }
    else
    {
        alert( "3,4ではありません。" );
    }
}
</script>

サンプル（別窓）

上記サンプルでは、変数numに5を代入しています。そして最初のif文で、変数numが3かどうかをチェックしています。 そうではないのでelse以下が実行されます。

elseの中で、もう一度if文を使っています。変数numが4かどうかをチェックします。4ではないので、else以下の処理が行なわれます。 その結果、「3,4ではありません。」と表示されます。

因みに上記の式は、以下のようにすっきりと書くことができます。

if ( n == 3 ){ alert( "3が入っています。" ); }
else if ( n == 4 ) { alert( "4が入っています。" ); }
else { alert( "3,4ではありません。" ); }