Javascriptの超入門編8

条件文（if文・switch文）

条件判断の結果に応じて処理を切り分ける方法について学ぶ

【開発環境】
OS；Window10
Webブラウザ：Google　Chrome
テキストエディタ：Brackets

【if】
●if文
1.書式
if(条件式){
　処理1
} else {
処理2
}
2.例文
スクリプト

値を入力

コンソール表示

・比較演算子
a == b →aとｂが等しければ真
a === b→aとｂが厳密に等しければ真
a != b→aとｂが等しくなければ真
a < b→aがｂより、小さければ真
a <= b→aがｂ以下であれば真
a > b→aがｂより大きければ真
a >= b→aがｂ以上であれば真
「==」と「===」は違う、「===」の場合は入力したものを数字に直すためにparselnt関数を使う必要がある。

・プリミティブ型とオブジェクト型の比較の違い
1.プリミティブ型
var s1="JavaScript";
var s2="JavaScript";
s1 == s2 或いはs1 === s2 が成り立つ

2.オブジェクト型
var s1 = new String("JavaScript");
var s2 = new String("JavaScript");
s1 == s2 或いはs1 === s2 は不成立
成立するには
var s1 = new String("JavaScript");
var s2 = s1;とする。

●if～else文
書式
if（条件式1）{
条件が成り立った場合の処理

}else if(条件式2){
　条件式1が成り立たず、条件式2が成り立った場合の処理

}else if(条件式3){
　条件式1、条件2が成り立たず、条件式3が成り立った場合の処理

}else{
　すべての条件式が成り立たなかった場合の処理

}
例文→スクリプト「fare1.html」
＜!DOCTYPE html＞
＜html lang="ja"＞
＜head＞
＜meta charset="utf-8"＞
＜title＞JavaScriptのテスト＜/title＞
＜/head＞
＜body＞
＜script＞
var age = prompt("年齢を入力してください");
if (age < 3) {
console.log("無料");
} else if (age < 7) {
console.log("500円");
} else if (age < 12) {
console.log("1,000円");
} else if (age < 64) {
console.log("2,000円");
} else {
console.log("無料");
}
＜/script＞
＜/body＞
＜/html＞

●if文を入れ子にする
書式
if (条件式1){
処理1
　　if (条件式2){
処理2
}
}else{
if(条件式3){
処理3
　　}
}
例文→スクリプト「fare2.html」
＜!DOCTYPE html＞
＜html lang="ja"＞
＜head＞
＜meta charset="utf-8"＞
＜title＞JavaScriptのテスト＜/title＞
＜/head＞
＜body＞

＜script＞
var age = prompt("年齢を入力してください");
if (age < 0) {
alert("年齢には正の値を入力してください");
} else {
if (age < 3) {
console.log("無料");
} else if (age < 7) {
console.log("500円");
} else if (age < 12) {
console.log("1,000円");
} else if (age < 64) {
console.log("2,000円");
} else {
console.log("無料");
}
}
＜/script＞

＜/body＞
＜/html＞

●三項演算子
書式
（条件式）？値1:値2
例文
＜!DOCTYPE html＞
＜html lang="ja"＞
＜head＞
＜meta＞
＜title＞JavaScriptのテスト＜/title＞
＜/head＞

＜body＞
＜script＞
var rate = prompt("点数を入力してください");
var result;
result = (rate >= 80) ? "合格" : "不合格";
console.log(rate + "点は" + result);
＜/script＞
＜/body＞
＜/html＞
値入力

コンソール表示


●switch文
書式
switch（num）{
　 case 1:
処理1
break;
case 2:
処理2
break;
case 3:
処理3
break;

・・・・・
default:
}
例文
＜!DOCTYPE html＞
＜html lang="ja"＞

＜head＞
＜meta charset="utf-8"＞
＜title＞JavaScriptのテスト＜/title＞
＜/head＞

＜body＞
＜script＞
var season = prompt("春、夏、秋、冬を入力してください");
switch(season){
case "春":
console.log("Spring");
break;
case "夏":
console.log("Summer");
break;
case "秋":
console.log("Autumn");
break;
case "冬":
console.log("Winter");
break;
default:
console.log("春、夏、秋、冬を入力してください");
}
＜/script＞
＜/body＞
＜/html＞
値入力

コンソール表示