Wikibooks

「JavaScript/制御構造」の版間の差分

履歴の双方向閲覧
← 古い編集次の差分 →
削除された内容 追加された内容
ビジュアルウィキテキスト
Ef3 (トーク | 投稿記録)
7,145 回編集
節加筆 for ... in / for ... of / for await... of
Ef3 (トーク | 投稿記録)
7,145 回編集
truthy / falsy、s/else文/else節/、switch文にdefault節追加、var を const 出来なければ let に置き換え
5 行
 
<source lang="javascript">
varlet n = 0;
 
if ( n < 0 ) {
21 行
 
== if-else ==
'''[[w:if文|if文]]'''（イフぶん、''if statement''）は「もし〜ならば」を表す制御構文（条件構文）です。
if文のブロックではかっこ{{code|( )}}の中に書かれた条件が真 [[JavaScript/truthy|truthy]] であるときのみ続く文が実行されます。次のプログラムは、''n'' < 0（''n''が0より小さい）という条件が真であるときのみ「負の数」と表示します。
 
<source lang="javascript">
varlet n = -1;
 
if ( n < 0 ) {
31 ⟶ 32行目:
</source>
 
if文のあとに'''else文節'''（エルスぶんせつ、''else statementclause''）を置くと、else節の文のブロックはif文のかっこの中に書かれた条件がfalse [[JavaScript/falsy|falsy]] であるときのみ実行されます。次のプログラムは、''n'' < 0（''n''が0より小さい）という条件が真であれば「負の数」、さもなくば（''n''が0以上ならば）「自然数」と表示します。計算機科学では一般に0を自然数に含め、曖昧さを避けたいときは非負整数とも言います。
 
<source lang="javascript">
varlet n = 0;
 
if ( n < 0 ) {
44 ⟶ 45行目:
</source>
 
if文とelse文節をあわせてif-else文節と呼びます。else文節は必ず直前のif文とくっつくので、if文とelse文節の間に余計な文を入れることはできません。if-else文節は次のように何個もつらねることができます。
 
<source lang="javascript">
varlet n = 0;
 
if ( n < 0 ) {
60 ⟶ 61行目:
</source>
 
このプログラムは''n'' < 0ならば「負の数」、そうでなく''n'' > 0ならば「正の数」、そうでもないならば「0」と表示します。else ifという部分に注目してください。何通りもの条件で処理を分岐したい場合は、このelse ifを何個も増やしていくことになります。if文やelse文節のブロックの中に単文（1つの文）しか入っていない場合は、ブロックを省略することができます。すなわち、次のように書いても同じことです。
 
<source lang="javascript">
varlet n = 0;
 
if ( n < 0 )
76 ⟶ 77行目:
 
<source lang="javascript">
varlet n = 0;
 
alert( n < 0 ? "負の数"
91 ⟶ 92行目:
</source>
 
これを利用すると他の言語（例えばC言語）では、''n''が0に等しいかどうかは <source lang="c" inline>if ( ''n'' == 0 ) { /* ... */ } </source>のほかに <source lang="c" inline>if ( !''n'' ) { /* ... */ }</source> と書くこともできます。、同様に、 ''n''が0に等しくないかどうかは <source lang="c" inline>if ( ''n'' != 0 ) { /* ... */ }</source> のほかに <source lang="c" inline>if ( ''n'' ) { /* ... */ }</source> と書くこともできます。この知識は次の例題をエレガントに解くのに必要になるかもしれません。
 
しかし、JavaScript では「0以外にも falsy な値がある」（例えば "" 、 !"" === true は真になる）ので上記のC言語流のブールコンテキストのイデオムは使えません。
JavaScriptでは''n''が0に等しいかどうかは ''n'' === 0 のように ===（厳密比較演算子）を使います。
=== は==（比較演算子）とは異なり暗黙の型変換は行われず厳密に（この場合は 0 と）等しいかを評価します。
 
* '''例題'''
97 ⟶ 102行目:
 
* '''解答'''
if-else文節を用いる場合は、
 
<source lang="javascript">
138 ⟶ 143行目:
alert( ( n % 2 ? "奇"
: "偶" ) + "数" );
</source>
または
 
<source lang="javascript">
alert( "偶奇"[n % 2] + "数" );
</source>
 
など。
 
=== if-else 文の構文===
<source lang="js">
if (条件式)
文１
[else
文２]
</source>
{{code|[}}から{{code|]}}までは省略可能を意味し、この場合は「else節は省略可能」を意味します。
 
== switch ==
'''[[w:switch文|switch文]]'''（スイッチぶん、''switch statement''）は、if-else文節を何個もつらねて書くのことが面倒冗長な場合に用いられます。
 
<source lang="javascript">
157 ⟶ 176行目:
else if ( keyCode == 40 ) {
alert("↓");
}
else {
alert("？");
}
</source>
176 ⟶ 198行目:
alert("↓");
break;
default:
alert("？");
}
</source>
182 ⟶ 206行目:
 
<source lang="javascript">
alert( { 37: "←", 38: "↑", 39: "→", 40: "↓" }[keyCode] || "？" );
</source>
 
=== switch 文の構文===
<source lang="js">
switch (式) {
case 値1 :
文1
case 値2 :
文2
...
case 値n :
文n
[default :
文x]
</source>
switch文に与えられた式に一致するcase句の値をルックアップし（比較は厳密比較演算子 === による）、対応する文が実行され'''break文などの中断制御文が見つからない限り次の文が実行されます'''。
 
== while ==
189 ⟶ 228行目:
 
<source lang="javascript">
varlet i = 0;
while ( i < 10 ) {
alert(i);
205 ⟶ 244行目:
 
<source lang="javascript">
varlet i = 0;
do {
alert(i);
213 ⟶ 252行目:
 
== for ==
'''[[w:for文|for文]]'''（フォー文、''for statement''）は、varlet ''i'' = 0のような変数の初期化と、''i'' < 10のような条件式と、''i''++のような変数の更新を一行で書くことができる最も一般的かつ実用的な制御構文です。JavaScriptではwhile文やdo-while文はあまり使われませんが、for文はループを簡潔に書けるので非常に重宝します。次のプログラムは0から9までの数字を表示します。
 
<source lang="javascript">
for ( varlet i = 0; i < 10; i++ ) {
alert(i);
}
</source>
 
varlet ''i'' = 0はループに入る前に一度だけ実行されます。次に''i'' < 10がtrueならばブロックを実行し、''i''++を実行して再び条件式に戻ります。''i'' < 10がtrueである間、ブロックの実行と変数の更新が行われるということです。<!--- for文はかっこの中に3つの式を書ける強力な制御構文なので、他の構文はすべてfor文の特別な場合であるとも考えられます。
たとえば、配列の要素を1つずつ取り出して処理をするような場合はfor文を使います。
 
227 ⟶ 266行目:
 
<source lang="javascript">
varlet array = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
for ( varlet i = 0; i < array.length; i++ ) {
alert( array[i] );
}
236 ⟶ 275行目:
 
<source lang="javascript">
varconst array = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
for ( varlet i = 0; i < array.length; i++ )
alert( array[i] );
</source>
244 ⟶ 283行目:
 
<source lang="javascript">
varconst array = [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 ];
for ( varlet i = 0; i < array.length; alert( array[i++] ) )
;
</source>
265 ⟶ 304行目:
 
== for ... of ==
for ... of 文は、IteratableIterableオブジェクト（たとえば String や Array）に対して、反復処理を行う。
<source lang="javascript">
const ary = [..."XYZ"];
281 ⟶ 320行目:
<source lang="javascript">
async function* asyncShift() {
for (let i = 1; i < 2 ** 16; yield i <<= 3)
;
}
 
(async function() {
for await (letconst num of asyncShift()) {
console.log(num);
}
302 ⟶ 341行目:
 
<source lang="javascript">
for ( varlet i = 0; i < 10; i++ ) {
if ( i == 5 )
break;
313 ⟶ 352行目:
 
<source lang="javascript">
for ( varlet i = 0; i < 10; i++ ) {
if ( i % 3 )
continue;
325 ⟶ 364行目:
<source lang="javascript">
LOOP:
for ( varlet x = 0; x < 10; x++ ) {
for ( varlet y = 0; y < 10; y++ ) {
if ( y == 5 )
break LOOP;
335 ⟶ 374行目:
 
== その他の制御文 ==
<!-- with文が制御構造であるかは疑問、非推奨で有ることを強調するために残した。 -->
 
=== with文 ===
曖昧さを持ち込むため'''with 文の使用は推奨されない'''。
また、strictモードでは SyntaxError となる。
 
with文の用途は、実際のコードを見ると良い。次の２つの関数は同じ意味である。
360 ⟶ 400行目:
これは Pascal などの言語から採用されたものである。
with は、with により修飾名が省略されたことにより識別子に曖昧さを持ち込む事で、意図しないプロパティが使われるなど問題を生じることが知られており、'''with 文の使用は推奨されない'''。
また、strictモードでは SyntaxError となる。
 
 
<!-- with 文以外は、文ではなく「演算子」。「演算子」「式」「文」の違いをしっかり理解しましょう。
"https://ja.wikibooks.org/wiki/JavaScript/制御構造" より作成