「JavaScript/制御構造」の版間の差分
削除された内容 追加された内容
Yuki Konno (トーク | 投稿記録) ページの作成: '''制御構造'''（せいぎょこうぞう、''control flow''）とは、命令を実行する順番のことです。単純なプログラムでは上か... |
Yuki Konno (トーク | 投稿記録) 編集の要約なし |
||
1 行
'''[[w:制御構造|制御構造]]'''（せいぎょこうぞう、''control flow''）とは、
== 概要 ==
次のプログラムは''n''が0より小さいときには「負の数」、''n''が0より大きいときには「正の数」、さもなくば（''n''が0のときには）「0」と表示します。
<source lang="javascript">
var n = 0;
if ( n < 0 ) {
alert("負の数");
}
else if ( n > 0 ) {
alert("正の数");
}
else {
alert("0");
}
</source>
順番に見ていきましょう。あせらず、じっくりと考えてください。
== if-else ==
'''[[w:if文|if文]]'''（イフぶん、''if statement''）は「もし〜ならば」を表す制御構文（条件構文）です。if文のブロックはかっこの中に書かれた条件がtrueであるときのみ実行されます。次のプログラムは、''n'' < 0（''n''が0より小さい）という条件がtrueであるときのみ「負の数」と表示します。
<source lang="javascript">
var n = -1;
if ( n < 0 ) {
alert("負の数");
}
</source>
if文のあとに'''else文'''（エルスぶん、''else statement''）を置くと、else文のブロックはif文のかっこの中に書かれた条件がfalseであるときのみ実行されます。次のプログラムは、''n'' < 0（''n''が0より小さい）という条件がtrueであれば「負の数」、さもなくば（''n''が0以上ならば）「自然数」と表示します。計算機科学では一般に0を自然数に含めます。
<source lang="javascript">
var n = 0;
if ( n < 0 ) {
alert("負の数");
}
else {
alert("自然数");
}
</source>
if文とelse文をあわせてif-else文と呼びます。else文は必ず直前のif文とくっつくので、if文とelse文の間に余計な文を入れることはできません。if-else文は次のように何個もつらねることができます。
<source lang="javascript">
18 ⟶ 60行目:
</source>
<source lang="javascript">
31 ⟶ 73行目:
</source>
なお、この場合は条件演算子を
<source lang="javascript">
var n = 0;
alert( n < 0 ? "負の数"
: n > 0 ? "正の数"
: "0" );
</source>
if文の条件式はすべてtrueかfalseの[[JavaScript/Boolean|真偽値]]として評価されます。たとえば、数値の0は真偽値に変換するとfalseになるので、次のif文のブロックは絶対に実行されません（[[w:到達不能コード|デッドコード]]）。
<source lang="javascript">
if ( 0 ) {
// たどりつけない
}
</source>
これを利用すると、''n''が0に等しいかどうかは if ( ''n'' == 0 ) { /* ... */ } のほかに if ( !''n'' ) { /* ... */ } と書くこともできます。同様に、''n''が0に等しくないかどうかは if ( ''n'' != 0 ) { /* ... */ } のほかに if ( ''n'' ) { /* ... */ } と書くこともできます。この知識は次の例題をエレガントに解くのに必要になるかもしれません。
* '''例題'''
整数の偶奇判別プログラムを書け。
* '''解答'''
if-else文を用いる場合は、
<source lang="javascript">
if ( n % 2 == 0 ) {
alert("偶数");
}
else {
alert("奇数");
}
</source>
または
<source lang="javascript">
if ( n % 2 ) {
alert("奇数");
}
else {
alert("偶数");
}
</source>
条件演算子を用いる場合は、
<source lang="javascript">
alert( n % 2 == 0 ? "偶数"
: "奇数" );
</source>
または
<source lang="javascript">
alert( n % 2 ? "奇数"
: "偶数" );
</source>
または
<source lang="javascript">
alert( ( n % 2 ? "奇"
: "偶" ) + "数" );
</source>
など。
== switch ==
'''[[w:switch文|switch文]]'''（スイッチぶん、''switch statement''）は、if-else文を何個もつらねて書くのが面倒な場合に用いられます。
<source lang="javascript">
if ( keyCode == "←" ) {
alert("左");
}
else if ( keyCode == "↑" ) {
alert("上");
}
else if ( keyCode == "→" ) {
alert("右");
}
else {
alert("下");
}
</source>
これはswitch文を使って次のように書くことができます。
<source lang="javascript">
switch (keyCode) {
case "←":
alert("左");
break;
case "↑":
alert("上");
break;
case "→":
alert("右");
break;
default:
alert("下");
}
</source>
必ずcase節の最後にbreak文を書くのを忘れないでください。default節の最後のbreak文は省略してもかまいません。なお、たいていのケースではswitch文を使わなくても、連想配列を応用したディスパッチテーブルで事足ります。switch文はここぞというときに使ってください。
<source lang="javascript">
alert( { "←": "左", "↑": "上", "→": "右", "↓": "下" }[keyCode] );
</source>
== while ==
いよいよループの登場です。'''[[w:while文
<source lang="javascript">
var i = 0;
while ( i < 10 ) {
alert(i);
52 ⟶ 195行目:
</source>
10回ループが回ると''i''が10になり、''i'' < 10がfalseになるのでループを抜けます。このようにwhile文は''i'' < 10がtrueである間、ブロックを実行しつづけます。よってこのプログラムは0から9までの数字を表示します（10になるとループから抜ける）。
while文は条件式がtrueであれば延々とループを回し続けるので、いつまで経ってもfalseにならないような条件を指定すると無限ループになります。無限ループが発生すると処理系がフリーズする場合があるので注意してください。以下のプログラムは、絶対に実行しないでください。
<source lang="javascript">
while ( true ) {
break;
}
</source>
ウェブブラウザ上のJavaScriptで本当に無限ループがほしい場合は、[[JavaScript/DOM/window/setInterval|window.setInterval]]などのメソッドを使用します。
<source lang="javascript">
setInterval(function(){
// ビジーウェイト
}, 0);
</source>
JavaScriptではwhile文に空の条件式を指定することはできません。
== do-while ==
'''[[w:do-while文|do-while文]]'''（ドゥ・ホワイル文、''do-while statement''）は、まずdo文のブロックを実行し、次にwhile文の条件式を確
<source lang="javascript">
var i = 0;
do {
alert(i);
66 ⟶ 228行目:
while ( i < 10 );
</source>
== for ==
'''[[w:for文|for文]]'''（フォー文、''for statement''）は、var ''i'' = 0のような変数の初期化と、''i'' < 10のような条件式と、''i''++のような変数の更新を一行で書くことができる最も一般的かつ実用的な制御構文です。JavaScriptではwhile文やdo-while文はあまり使われませんが、for文はループを簡潔に書けるので非常に重宝します。次のプログラムは0から9までの数字を表示します。
<source lang="javascript">
77 ⟶ 237行目:
}
</source>
var ''i'' = 0はループに入る前に一度だけ実行されます。次に''i'' < 10がtrueならばブロックを実行し、''i''++を実行して再び条件式に戻ります。''i'' < 10がtrueである間、ブロックの実行と変数の更新が行われるということです。for文はかっこの中に3つの式を書ける強力な制御構文なので、他の構文はすべてfor文の特別な場合であるとも考えられます。
たとえば、配列の要素を1つずつ取り出して処理をするような場合はfor文を使います。
<source lang="javascript">
var array = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
for ( var i = 0, l = array.length; i < l; i++ ) {
alert( array[i] );
}
</source>
単文の場合はブロックを省くことができます。
<source lang="javascript">
var array = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
for ( var i = 0, l = array.length; i < l; i++ )
alert( array[i] );
</source>
後置インクリメント演算子は変数の値を1増やし、増やす前の値を返すので、次のように書くこともできます。
<source lang="javascript">
var array = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
for ( var i = 0, l = array.length; i < l; alert( array[i++] ) );
</source>
このような書き方をしても読みにくいだけですが、こちらの方が簡潔だという人もいるでしょう。
== break ==
'''[[w:break文|break文]]'''（ブレーク文、''break statement''）はループまたはswitch文を途中で抜けます。次のプログラムは''i''が5になった時点でfor文のループを抜けるので、0から4までの数字を表示します。
<source lang="javascript">
for ( var i = 0; i < 10; i++ ) {
85 ⟶ 275行目:
}
</source>
すぐに気づいた人もいるでしょうが、while文の無限ループの例は実際には無限ループになっていません。
== continue ==
'''[[w:continue文|continue文]]'''（コンティニュー文、''continue statement''）はループを次に進めます。次のプログラムは0から9までの数字を表示しますが、[[w:四の字|4]]だけは死に通じるため表示しません。
<source lang="javascript">
for ( var i = 0; i < 10; i++ ) {
if ( i ==
alert(i);
}
95 ⟶ 289行目:
== ラベル ==
ラベルを使
<source lang="javascript">
LOOP:
for ( var
for ( var
if (
alert( [
}
}
</source>
| |||