TIL 007|条件文の基礎


1.条件文は


JavaScriptでは、条件文には、特定の条件を満たすときにコードを実行する機能があります.指定した条件が真の場合、if文は文を実行します.
if (condition) {
  statement
}
ifの後ろに条件カッコ()があり、次に実行するコードをカッコ{}に表します.カッコ()の条件が真の場合、カッコ内の文が実行され、偽の場合は実行されません.文が1つしかない場合は、括弧なしで直接文を書くこともできます.
else ifを使用すると、複数の条件文を接続することもできます.
if (condition1) {
  statement1
} else if (condition2) {
  statement2
} else {
  statement3
}
条件1が満たされている場合はコマンド1を実行し、条件2が満たされている場合はコマンド2を実行し、前の2つの条件が満たされていない場合は(したがって、最後にelseのみを書く)、最後のコマンド3を実行する.

2.比較演算子


(画像ソース:https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Expressions_and_Operators#comparison_operators)

ここで、等号を含む演算子==と==は少し異なります.3つの値はデータ型に正確に一致する必要があります(厳密に比較します).2つの値は、データ型が異なる場合でも、同じ値と見なすことができる場合は、同じ値と見なす(抽象比較)=わあ!=同じ原理です.
5 == 5      // true
5 == "5"    // true
5 === 5     // true
5 === "5"   // false

7 != 7      // false
7 != "7"    // false
7 !== 7     // false
7 !== "7"   // true

3.論理演算子


(画像ソース:
https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Expressions_and_Operators#logical_operators )

ここで&&は私たちが一般的に知っているandの概念であり、|orの概念と考えられる.まだあります.notの概念で、trueに加えてfalse、falseに加えてtrueです.
1 + 1 === 2 && 2 + 2 === 4       //true
1 + 1 === 2 && 2 + 2 === 5       //false
1 + 1 === 3 && 2 + 2 === 4       //false

1 + 1 === 2 || 2 + 2 === 4       //true
1 + 1 === 2 || 2 + 2 === 5       //true
1 + 1 === 3 || 2 + 2 === 4       //true
1 + 1 === 3 || 2 + 2 === 5       //false

!(1 + 1 ===2)   // false
!(1 + 1 ===3)   // true

4.真実とFalsy


javascriptでは、trutty(本当に同じ値)はbooleanコンテキストでtrueを望む値です.falsey(虚偽の値)と別途定義されていない場合は、本物と見なします.
falseyに相当するのは以下の通りです.
  • 0
  • "または"(空の文字列)
  • null(完全無値)
  • 未定義(未定義値)
  • NaN(非数値)
  • let username = "김코딩";
    if (username) {
      console.log("이름 O!!")
    } else console.log("이름 X!!")    //  이름 O
    ここではusernameに「kim codeding」が割り当てられているので、usernameはtruthyであり、条件文は真である.
    let username = "";
    if (username) {
      console.log("이름 O!!")
    } else console.log("이름 X!!")    //  이름 X
    ここで、usernameに空の文字列が割り当てられているため、falseyはfalseになり、条件文はfalseになります.
    let username;
    if (username) {
      console.log("이름 O!!")
    } else console.log("이름 X!!")    //  이름 X
    ユーザー名に何も割り当てられていない場合は未定義であるため、同じfalseであり、条件文はfalseである.これにより、変数が値を正しく割り当てているかどうかを確認する条件文が多くの点で役立つ可能性があります.

    5.条件3項演算子


    文のサムネイル形式の場合は、3つの演算子を使用できます.
    condition ? expressionIfTrue : expressionIfFalse
    条件.true時コマンド文:false時にコマンド文として書けばいいです.
    function findMax(num1, num2) {
      let max;
      num1 >= num2 ? max = num1 : max = num2;
      return max;
    }
    
    findMax (1, 3)    // 3
    findMax (5, 2)    // 5
    2つの数でより大きな値を探す関数を3つの演算子で表します.

    6.スイッチドア


    条件文に条件個数が多い場合if-else文を引き続き使用すると可読性が低下する可能性があるためswitch文を使用できます.
    switch (expression) {
      case value1:
        statement1;
        break;
      case value2:
        statement2;
        break;
      case value3:
        statement3;
        break;
      default:
        statement4;
    }
    式の結果がvalue 1の場合、defaultを適用してstatement 1を実行し、value 2はstatement 2を使用し、value 3はstatement 3を使用し、そうでなければdefaultを適用してstatement 4を実行します.
    条件が適切でbreakに遭遇した場合、その後の比較を行わずにスイッチドアを閉じる.
    default文はswitch文の最後にあるため、default文の実行が終了するとswitch文が終了します.したがって、通常breakは省略される.
    if-else文をswitch文に変換する例を次に示します.
    let num = 11;
    
    if (num % 2 === 0) {
      console.log("이 수는 짝수입니다!")
    } else if (num % 2 === 1) {
      console.log("이 수는 홀수입니다!")
    } else {
      console.log("양수를 입력해주세요!")
    }                                       // "이 수는 홀수 입니다!"
    数字が単数か偶数かを判別するコードです.同じ機能を持つswitch文を作成しました.
    let num = 11;
    
    switch (num % 2) {
      case 0 :
        console.log("이 수는 짝수입니다!!");
        break;
      case 1 :
        console.log("이 수는 홀수입니다!");
        break;
      default :
        console.log("양수를 입력해주세요!");
    }                                        // "이 수는 홀수입니다!"

    references


    MDN Web Docs
    http://hleecaster.com/javascript-conditionals/
    https://dasima.xyz/javascript-switch/