조건문(if / switch… case / 조건부 연산자)

minzyee·2023년 6월 23일
1

Today I Learn

목록 보기
3/8

📝 조건문이란?


조건문은 주어진 조건에 따라 코드를 실행하거나 실행하지 않는 문이다.
조건식의 결과가 true면 내부의 실행문이 실행되고, false면 실행문이 실행되지 않는다.


1️⃣ if 문

  • 조건문은 조건식과 실행문으로 구분 된다.
if(조건식) {
  실행문;
}

❌ 중첩 if 문은 피하는 것이 좋다.

중첩 if 문은 논리적으로 if → else if → else 문으로 변환이 가능하다.
조건문이 중첩되어 들여쓰기가 길어질수록 코드는 읽기 어려워져 가독성에 좋지 않다.

안좋은 예시

let first = true;
let second = false;

if (first) {
  console.log("첫 번째 조건 충족!");
            
  if (second) {
    console.log("두 번쨰 조건도 충족!");
  } else {
    console.log("두 번째 조건은 불충족!");
  }

} else {
  console.log("첫 번쨰 조건 불충족!");
}

좋은 예시

if(first && second){ // true랑 false 둘 다 true가 나와야 실행되는데, 식은 그게아님
  console.log("첫 번째 조건 충족!");
  console.log("두 번쨰 조건도 충족!");
}

else if(first){ // true니까 이곳의 콘솔이 모두 출력되고 조건문 마침.
  console.log("첫 번째 조건 충족!");
  console.log("두 번째 조건은 불충족!");
}

else {
  console.log("첫 번쨰 조건 불충족!");
}

2️⃣ switch 문

  • 조건문에는 if 문 외에도 switch 문도 있다.
  • if 문과 switch 문은 조건이 충족되면 실행된다는 공통점도 있지만, 차이점도 있다.
switch (조건식) {
  case 비교 조건식:
    실행문;
}
  • switch 문에는 조건식 두 개가 사용된다.
  • switch 옆 소괄호의 조건식의 값이 case의 비교 조건식 값과 일치(===) 하면 해당 실행문이 실행 된다.
  • 보통 조건식에 변수를 넣고, 비교 조건식에는 변수와 비교할 값을 넣는다.
let value = "A";

switch (value) {
  case "A":
    console.log("A");
}

// 결과: A

  • if 문의 else if 처럼 여러 방향으로 분기 할 수 있다.
    case를 여러 번 사용하면 된다.
let value = "B";

switch (value) {
  case "A":
    console.log("A"):
  
  case "B":
    console.log("B"):

  case "C":
    console.log("C"):
}

// 결과: B
// 결과: C

위의 코드를 보면 콘솔에 B만 출력될 것이라 예상했지만,
실제로는 B, C 모두 출력 된다.

switch문은 일치하는 case를 발견하면 일치 여부와 상관없이
그 아래 case 들의 실행문을 모두 실행한다.

따라서 원하는 결과만 얻으려면 수동적으로 case에서 빠져 나와야한다.
이때 break문이 사용된다.


break 문 추가하기

  • 각 case에 break 문을 추가하니까, 정확히 일치하는 case만 실행된다.
  • 어떠한 case도 일치하지 않을 때 실행하는 case도 만들 수 있다.
    단, 이때는 case 대신 default 라는 특수한 예약어를 사용한다.

break 추가해보기

let value = "B";

switch (value) {
  case "A":
    console.log("A"):
    break;
  
  case "B":
    console.log("B"):
    break;

  case "C":
    console.log("C"):
    break;
}
// 결과: B

defalt 추가해보기

let value = "F";

switch (value) {
  case "A":
    console.log("A"):
    break;
  
  case "B":
    console.log("B"):
    break;

  case "C":
    console.log("C"):
    break;
  
  default:
    console.log("아무것도 일치 안함"):
}
// 결과: 아무것도 일치 안함
  • F는 어떠한 case 에도 해당하지 않아서 다이렉트로 default가 실행됐다.
  • default에는 break문을 붙이지 않아도 된다.(맨 마지막 case 라서 다음에 실행될 것이 없기 때문)
  • switch문의 case는 else if 와 비슷하고, default는 else와 비슷하다고 생각 할 수 있다.
  • if문이 === 연산자만 사용한다면 switch문으로 쉽게 대체 가능하다.
    한 가지 다른 점이 있다면 else는 if나 else if 뒤에만 나오지만, default는 어디에나 위치 할 수 있다.

3️⃣ 조건부 연산자(삼항 연산자)

  • if 문과 switch 문 외에도 분기 처리에 사용하는 식이 있다.
  • 조건부 연산자는 문이 아니라 식이므로, 결괏값이 나온다.
조건식 ? 참일 때 실행되는 식 : 거짓일 때 실행되는 식

5 > 0 ? '참입니다' : '거짓입니다'; // 결과: "참입니다"

  • 조건부 연산은 조건에 따라 달라지는 값을 변수에 대입할 때 사용한다.
  • 아래의 코드에서는 대입 연산자(=)의 우선순위가 가장 낮기 때문에,
    조건부 연산의 결과값인 ‘거짓입니다’가 value 변수에 대입된다.
let value = 5 < 0 ? '참 입니다' : '거짓입니다';

value; // 결과: "거짓입니다"

중첩된 조건부 연산 순서

  • condition1과 condition2 변수의 값을 바꿔가면서 테스트 해보면,
    조건부 연산이 중첩된 경우엔 넘어가는 순서를 잘 파악해야 한다.
let condition1 = true;
let condition2 = false;
let value = condition1 ? condition2 ? '둘다 참' : 'condition1만 참' : 'condition1이 거짓';
console.log(value);  // condition1만 참

// 가독성을 위해 소괄호를 사용하기
let value = condition1 ? (condition2 ? '둘다 참' : 'condition1만 참') : 'condition2이 거짓';

// 가독성을 위해 들여쓰기로 구분하기
let value = condition1
  ? condition2
    ? '둘다 참'
    : 'condition1만 참'
  : 'condition1이 거짓';
profile
간지나는 인생을 살자.

0개의 댓글