[TIL]2022-11-11 if, switch (제어문 中 조건문) JavaScript

조건문

Conditional Statement

---

if 

// 제시한 조건( )이 맞을때만 해당 코드블럭 { }을 실행함.

else

// 제시한 조건( )에 맞지 않는다면 else의 코드블럭 { }을 실행함.

 

// 조건문 Conditional Statement

// if (조건)에 맞을때 {코드}를 실행

// if (조건) { } else { }

// if (조건1) { } else if(조건2) { } else { }

연습 예제

 

// 조건문 Conditional Statement
// if(조건)에 맞을때 {코드}를 실행 
// if(조건) { } else { }
// if(조건1) { } else if(조건2) { } else { }

let fruit = 'orange';
if(fruit === 'apple') {
    console.log('🍎');
} else if (fruit === 'orange') {
    console.log('🍊');
} else {
    console.log('🍕');
}

if (true) {
    console.log('출력되면 안됨');
}

 

Case :

// switch

// if else if else if else if ... else

//정해진 범위안의 값에 대해 특정한 일을 해야 하는 경우 switch를 사용가능.

MDN switch: https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/switch

switch - JavaScript | MDN

// 조건문 Conditional Statement
// switch
// if else if else if else if ... else
//정해진 범위안의 값에 대해 특정한 일을 해야 하는 경우 switch를 사용가능.

let day = 212; // 0: 월요일, 1: 화요일... 6: 일요일
let dYname;
if(day === 0) {
    dayName = '월요일';
} else if (day === 1) {
    dayName = '화요일';
}
  else if (day === 2) {
    dayName = '수요일';
}
  else if (day === 3) {
    dayName = '목요일';
}
  else if (day === 4) {
    dayName = '금요일';
}
  else if (day === 5) {
    dayName = '토요일';
}
  else if (day === 6) {
    dayName = '일요일';
}

// 지저분해 보이는 이러한 작업을 간편하게 할 수 있는 것이 switch !

switch (day) {
    case 0:
        dayName = '월요일'
        break;
    case 1:
        dayName = '화요일'
        break;
    case 2:
        dayName = '수요일'
        break;
    case 3:
        dayName = '목요일'
        break;
    case 4:
        dayName = '금요일'
        break;
    case 5:
        dayName = '토요일'
        break;
    case 6:
        dayName = '일요일'
        break;
    default: // else와 같은것!
        console.log('해당하는 요일이 없음!');
}

// break를 사용하지 않게 되면 코드리딩이 쭉 진행되어 마지막 결과값이 출력됨.
// console.log(dayName);

// let condition = "okay"; // okay, good -> 좋음!, bad -> 나쁨!
// let text;
// switch(condition) {
//     case 'okay':
//     case 'good':
//         text = '좋음!';
//         break; // 앞선 okay, good을 좋음이라 출력하고 싶을 때, break안씀.
//     case 'bad':
//         text = '나쁨!';
//         break;
// }

---

삼항 조건 연산자 

Ternary Operator

---

// 조건식, 조건표현식을 작성한 다음, 참인경우 : 거짓인경우

 

// if와 else를 쓸 수 있는 조건이라면 Ternary Operator을 쓰면 더 간결해짐.

 

// 삼항 조건 연산자 Ternary Operator
// 조건식, 조건표현식을 작성한 다음, 참인경우 : 거짓인경우
// if와 else를 쓸 수 있는 조건이라면 Ternary Operator을 쓰면 더 간결해짐.
// 아래의 세 조건문은 모두 동일하지만 형태만 다른것 !

let fruit = 'apple';
if (fruit == 'apple') {
    console.log('🍎');
}    else {
    console.log('😍');
}
fruit === 'apple' ? console.log('🍎') : console.log('😍');

let emoji = fruit === 'apple' ? '🍎' : '😍';
console.log(emoji);

---

QUIZ .

num = 2 //num의 숫자가 짝수이면👍 홀수이면👎

If문과 Ternary Operator로 각각 출력하라.

내가 작성한 답안지▼

let num = 2;
let left = (num % 2);

if (left === 0) {
    console.log('👍');
}   else {
         console.log('👎');  
    }

left === 0 ? console.log('👍') : console.log('👎');

let thumb = left === 0 ? '👍' : '👎'
console.log(thumb);

 모범답안보다 내가 작성한 답이 더 간결해서 기분 좋았음.

---