if( 条件式 ) {
処理;
}
if( 条件式 ) 処理;
と記述することもできます。
if( 条件式1 ) {
処理1;
}
else if( 条件式2 ) {
処理2;
}
else if( 条件式3 ) {
処理3;
}
:
else {
処理n;
}
var val = 1.01;
if( val == Math.floor(val) ) {
alert( "valは整数です" );
}
else {
alert( "valは少数です" );
}
a > b | aはbより大きいか? |
a >= b | aはb以上か? |
a < b | aはbより小さいか? |
a <= b | aはb以下か? |
a == b もしくは a === b | aとbは等しいか? |
a != b もしくは a !== b | aとbは等しくないか? |
== と === の違いについて
== と === そして != と !== は少し意味が異なる比較です。=== と !== はjavaScript特有の関係演算子で
「 === は型も含め完全に一致すれば true となる 」
「 !== は型もしくは値が一致しなければ true となる 」
となります。
型とはその変数が何を扱うものか(数なのか文字列なのかなど)という決まりごとです。
本講座は変数の値と型を調べる必要があるような処理は行わず、 == と != で比較して問題ない内容としています。
条件式1 && 条件式2 | 1、2ともに成り立つか? 両方成り立つ時に true になる |
条件式1 || 条件式2 | 1、2どちらか成り立つか? 両方もしくは一方が成り立てば true になる |
var val = 'a';
if( '0' <= val && val <= '9' ) {
alert( "valは半角数字です" );
}
else if( 'a' <= val && val <= 'z' ) {
alert( "valは半角英字(小文字)です" );
}
else if( 'A' <= val && val <= 'Z' ) {
alert( "valは半角英字(大文字)です" );
}
else {
alert( "valは半角英数字ではありません" );
}
switch( 変数もしくは式 ) {
case 値1:
処理1;
break;
case 値2:
処理2;
break;
case 値3:
処理3;
break;
:
:
default:
処理n;
break;
}
(補足)C系やJavaではswitch文で比較できるのは整数のみです。 一方JavaScriptはcaseの値を少数にすることもできますが、一般的なプログラミング言語のルールに基づいてswitchでの比較は整数としましょう。
for( 変数の初期値; 条件式; 変化する値の式 ) {
処理;
}
Chrome | その他のツール → デベロッパーツール → Console |
IE/Edge | ツール → F12開発者ツール → コンソール |
FireFox | 開発ツール → 開発ツールを表示 → コンソール |
Safari | 環境設定の詳細で「メニューバーに"開発"メニューを表示」をチェック、メニューバーの開発→エラーコンソールを表示 |
for( var i = 1; i <= 10 ; i ++ ) {
console.log(i);
}
このソースコードを実行すると、for文で処理が10回繰り返され、コンソールに 1,2,3,4,5,6,7,8,9,10 と数字が表示されます。
for文で繰り返し用に使う変数は慣例的に i とすることが多いですが、任意の変数名を使うことができます。
何かの条件によって処理を抜けたい時はbreak命令を用います。
【例2】
for( var i = 0; i < 100; i += 10 ) {
console.log(i);
if( i == 50 ) break;
}
この例ではiが100未満の間処理を繰り返す記述をしていますが、if文でiが50になった時に処理を抜けるので、コンソールには0,10,20,30,40,50と表示されます。
continue命令で以後の処理を無視し繰り返しの先頭に戻ることができます。
【例3】
var val = 10;
for( ; val >= 1; val -- ) {
if( val%3 == 0 ) continue;
console.log(val);
}
この例ではforの外側で変数valを定義し初期値を10としており、forの()内の初期値の記述を省略しています。
valを3で割った余りが0(すなわちvalが3の倍数)の時に繰り返しの先頭に戻ります。
コンソールには10,8,7,5,4,2,1と表示されます。
では次のようなソースコードではどのようなログが出力されるでしょうか?
01 | <!DOCTYPE html> |
---|---|
02 | <html lang="ja"> |
03 | <head> |
04 | <meta charset="utf-8"> |
05 | <title>JavaScriptのテストプログラム</title> |
06 | </head> |
07 | <body> |
08 | <script> |
09 | for( var i = 1; i <= 256; i = i*2 ) console.log(i); |
10 | </script> |
11 | </body> |
12 | </html> |
while( 条件式 ) {
処理;
}
【例】
var abc = 0;
while( abc < 20 ) {
console.log(abc);
abc += 4;
}
この例では変数abcが20未満の間、処理が繰り返されます。
コンソールには 0,4,8,12,16と表示されます。
while文の仲間に do ~ while があります。
do {
処理;
}
while( 条件式 );
無限ループにご用心
繰り返し処理では無限ループにならないように注意しましょう。
無限ループとは条件式が成り立たず延々と処理が回り続けることです。
無限ループに陥ったソフトウェアは処理が停止し、最悪の場合コンピューターがフリーズします。
JavaScriptではコンピューターがフリーズするところまで行くことは少ないと思いますが、ブラウザが停止したり落ちたりします。
forよりもwhileの方が一般的に無限ループに陥る可能性が高いですが、
for文でも繰り返しで使っている変数を処理内で書き換えるようなことをすると無限ループに陥ることがあります。