【JavaScript授業五日目】制御構文・比較演算子、if文・論理演算子
制御構文・比較演算子
手順を組み立てていくことが大事
どういう順番で伝えるかを意識する
●if文
・フローチャート書くとわかりやすい
var money = 5000;
if (money >= 10000) {
console.log('使いすぎ');
console.log('使いすぎ');
ブロック内には必要であれば複数の処理を記述できる
}
・条件:変数moneyが10000以上
・条件が満たされる場合に直後のブロックを実行
↓ 正確には
・条件がtrueの場合に直後のブロックを実行
・条件がfalseの場合は直後のブロックをスキップ
●波括弧(中括弧)の終わりにセミコロン(;)はつけない。
if (money >= 10000) {
console.log("使いすぎ");
}
一つの処理として扱っているのでつけなくていい。
→イメージ※10+(5+3) これの最後にセミコロンつけないのと一緒
●比較演算子は条件の結果で「true」「false」を返す
console.log(money >= 10000);
true:条件が満たされた時の値
false:条件が満たされないときの値
「true(真)」「false(偽)」を真偽値
データ型:真偽値(bookean型)
●↑false時の処理も指定する場合
var money = 10000;
if (money >= 10000) {
console.log('使いすぎ'); 条件式true時の処理
} else {
console.log("支払可能"); 条件式false時の処理
}
●else使わないパターン例
var shipping_message = "送料500円";
var shipping_fee = 500;
条件によってイレギュラーな値が入るif (money >= 5000) {
shipping_message = "送料無料";
shipping_fee = 0;
}
必ず実行する処理を分岐処理の後に記述console.log(shipping_message);
console.log("支払金額" + money + "円");
console.log("合計金額" + (money + shipping_fee) + "円");
●else if
var num = 10;
if (num < 20) {
第1条件がtrue時の処理
console.log('20より小さい');
} else if (num < 40) {
第2条件がtrue時の処理
console.log('20以上40より小さい');
} else {
第1・2条件がfalse時の処理
console.log('40以上');
}
●else使わないパターン
var money = 3000;
var shipping_fee = 500;
var message = "送料500円";
if (money >= 5000) {
shipping_fee = 0;
message = "送料無料";
} else if (money >= 3000) {
shipping_fee = 200;
message = "送料200円";
}
console.log(`購入金額:${money}円`);←文字連結この方法もある
console.log(message);
console.log("総支払額:" + (money + shipping_fee) + "円");
●よくあるミス
var num = 40;
if (num >= 20) {
console.log('20以上');
} else if (num >= 40) {
console.log('40以上');
} else {
console.log('20より小さい');
}
・これだと、第二条件の「40以上」は表示されない
・第一条件に第二条件が飲まれてしまっている
・第一条件と第二条件を入れ替えると、正しく実行できる