if文制御
ブーリアン
JavaScript には、数値型や文字列が対外に重要なもう一つの型があります
それがブーリアン型(Boolean) です
このブーリアン型は true （真）と false （偽）という値を持ち
主にプログラムの制御や値の判断に使用されるのです
これらブーリアンの値は、直接変数に代入することもできますが
多くの場合論理演算によってその結果を取得します
論理演算とは、一つの以上の変数の内容が期待する値がどうかを調べられます
| 演算子 |
記号 |
| 等しい |
== |
| より大きい |
> |
| より大きいか等しい |
>= |
| 等しくない |
!= |
| より小さい |
< |
| より小さいか等しい |
<= |
| 論理 AND |
&& |
| 論理 NOT |
! |
| 論理 OR |
|| |
例えば、== 演算子は左右のオペランドが等しければ true
そうでなければ false を返します
var variable = true;
alert(variable == false);
alert(10 > 5);
alert("Kitty" != "Kitten");
まず、変数 variable にはブーリアン型び値 true が格納されます
これと false を == 演算子で比較し、同じかどうかを調べています
true と false は等しくないので、alert() には false (すなわち 偽) が返ります
次は、数値リテラル 10 が 5 よりも大きいかどうかを調べています
当然、10は5よりも大きいので true (すなわち 真) が返ります
通常のプログラムでは、リテラルどうしの比較は意味がないので行いません
最後は、文字列どうしの比較で "Kitty" と "Kitten" が等しくないかを調べます
それらの文字列は等しくないので true が返ります
論理 AND は論理積とも呼ばれ
両辺のオペランドが true の時 true をかえし、そうでなければ false を返します
論理 NOT は論理否定とも呼び
右辺のオペランドの逆のブール値を返します(つまり真なら偽、偽なら真になります)
論理 OR は論理和とも呼び
両辺のオペランドが false のときには false、そうでなければ true を返します
var bool1 = true , bool2 = false;
alert(bool1 && bool2);
alert(bool1 || bool2);
alert(bool1 || !bool2);
bool1 は true であり、bool2 は false です
論理積は一方でも false の場合は false を返すため、最初は false を表示します
次の論理和は、一方でも true であれば true を返すため true を表示します
最後の論理積は、bool2 を論理否定して true を返しています
そのため、両辺が true になるため、論理積は true を返します
このような評価方法は、複数の式を評価する時に必要になります
JavaScript の論理演算はショートサーキット評価と呼ばれるもので
たとえば、論理積の場合左辺が false の場合は右辺がどのような値でも false になります
そのため、スクリプトエンジンは右辺を評価することなく false を返します
論理和であれば、左辺が true であれば右辺を調べる必要はないので ture を返します
そのため、論理積は false の可能性の高い変数を左辺に、
論理和は true の可能性の高い変数を左辺に配置することで、実行速度を向上できます
確認メッセージボックス
alert() による警告ダイアログボックス以外に
JavaScript はユーザーに[OK]、または[キャンセル]ボタンを要求し
ユーザーは、水からの意思でいずれかのボタンを押してJavaScriptに自分の意思を伝えます
この、確認メッセージボックスには confirm() メソッドを使います
このメソッドは、ユーザーの選択によってブール値を返します
confirm("message")
message には、ダイアログに表示する文字列を指定します
このメソッドは、ユーザーが[OK]を押したら true、そうでなければ false を返します
ただし、メソッドが返す値は必ずしも受け取る必要はありません
var variable = confirm("Do you like kitty?");
alert(variable);
[OK]ボタンを押すと true、[キャンセル]ボタンを押すと false が表示されます
この値は、下記するプログラムのフロー制御に重要な役割を持ちます
プログラムの流れを変える
これまで、プログラムは上から下へ順に流れるものでした
しかし、プログラムは状態の変化に応じて動作するべきでもあります
そのため上から下に流れる逐次実行の他に、いくつかに分岐する選択が存在します
選択によるプログラムの分岐の代表的なステートメントが if文 です
これは、渡されたブール値が true であれば実行するというものです
if (condition) statement
condition にはブール式を指定します
後記する null という値、または undefined の場合は false と解釈されます
statement には、condition が true の時にのみ実行するステートメントを指定します
var bool = true;
if (bool) alert("Kitty on your lap");
if (false) alert("Tokyo mew mew");
変数 bool は true です
最初の if 文では true が渡されるので結果として alert("Kitty on your lap"); が実行されます
しかし、次の if 文は false リテラルが渡されいるので alert("Tokyo mew mew"); は実行されません
もっとも、通常は意味がないので if 文にリテラルを渡すようなことはありません
if 文は true の時に後続する1つのステートメントを実行します
そうでなければそのステートメントを無視しますが、複数のステートメントを扱いたい場合は
{ } で囲むことで複数のステートメントを if に関連付けられます
var variable = "Kitty";
if (variable == "Kitty") {
variable = "Kitty on your lap";
alert(variable);
}
単一のステートメントでも { } を用いることができるので
不必要なミスをなくすためにも普段から { } をつける癖をつけることが推奨されます
このような分岐処理をするとそうでなければという処理も必要になります
つまり if 文で判定した論理値が偽だったとき専用の処理です
これは論理否定 ! と if 文を使って作成することも可能ですが、非合理的です
if 文には、評価結果が偽だった時に処理する else と組み合わせられます
if (condition) statement1
[else statement2]
これが、正式な if ステートメントの全貌です
先ほどは else を省略していましたが、これを指定することで
前の if 文が処理されなかったときに処理するステートメントを指定できます
else の前には、必ず if 文が必要であることに注意してください
var strText;
if (confirm("Do you like kitten?")) strText = "I'm so glad ^-^";
else strText = "You must love kitten!!";
alert(strText);
「あなたは子猫が好きか?」という質問に対して
OK と キャンセルによって表示される文字が変化するプログラムです
ここでは使っていませんが、当然 else でも { } によるブロック化を使えます
因みに、if だけによる分岐を単一選択構造と呼び
if〜else〜 による分岐を分岐選択構造と呼ぶことがあります
if - else -
if (condition)
statement1
[else
statement2]
条件式の値を評価し、それによって適切なステートメントを実行します
condition - 任意のブール式を指定します
statement1 - condition が true の時に実行するステートメントを指定します
statement2 - condition が flase の時に実行するステートメントを指定します