JavaScript勉強会

JavaScriptの学習日記

3.3 動作のバリエーションを増やす　《条件分岐(else if)》　【JavaScript超入門】

JavaScript 読書メモ

JavaScriptの学習メモ。

今日は『確かな力が身につくJavaScript「超」入門』の第３章を読んでみます。

 

jsstudy.hatenablog.com

 

 

3.3 動作のバリエーションを増やす

構造化プログラミングの基本動作は、

  1. 順次
  2. 選択（条件分岐）
  3. 反復（繰り返し）

の３つです。

（参考）JavaScript学習 準備編 - JavaScript勉強会

 

選択（条件分岐）は「if」で書きますが、場合分けを増やしたいとき「else if」という書き方が用意されています。

 

else if

(p.81)

if文の条件式がfalseになると、else以降が実行されます。

elseの後ろにまた別のif文をつけ加えることができます。

 

サンプルコード

<html>
<head>
    <meta charset="UTF-8">
    <title>3-03 else if</title>
</head>
<body>
    <p>「if」「else」「else if」の使い方テスト</p>
    <script>
        var answer = window.prompt('ヘルプを見ますか？');  
        if (answer === 'yes') {
            window.alert('処理1');
        } else if(answer === 'no') {
            window.alert('処理2');
        } else {
            window.alert('処理3');
        }
    </script>
</body>
</html>

 

上記のコードは、

(1) まず、「answer === 'yes'」の条件式が評価されます。

　変数answerに保存されているデータが'yes'かどうかを判断して、その評価結果がtrueであれば続くブロック {～} 内の処理1が実行されます。

　falseであればelse以降に進みます。

(2) ここにもifがあって、今度は「answer === 'no'」の条件式が評価されます。

　変数answerに保存されているデータが'no'かどうかを判断して、その評価結果がtrueであれば続くブロック {～} 内の処理2が実行されます。

　falseであればelse以降に進みます。

(3) もうif文がないので、処理3が実行されます。

 

if文は必要なだけ追加して、場合分けを増やすことができます。

2番目以降のifは、elseの後に続ける形＝「else if」と書きます。

（elseとifの間に半角スペースを入れる。）

 

JavaScript以外のプログラミング言語でも、この「else if」に相当する機能はたいてい用意されています。

 

（参考）

PHP：「else if」または「elseif」と書く。

PHP: elseif/else if - Manual

Ruby：「elsif」と書く。ちょっと略したスペルですね？

複数の条件分岐(if...elsif...else...end) - 条件分岐 - Ruby入門

Python：「elif」と書く。Rubyよりもさらに略したスペルですねｗ

複数の条件分岐(if...elif...else) - 条件分岐 - Python入門

 

 

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)

確かな力が身につくJavaScript「超」入門 (確かな力が身につく「超」入門シリーズ)