본문 바로가기
dev/JavaScript

조건문

by masankong 2023. 4. 6.

 조건문

조건문은 주어진 조건식의 평가 결과에 따라 코드 블록(블록문)의 실행을 결정한다. 조건식은 Boolean 값으로 평가될 수 있는 표현식이다.

🤔 블록문이란? 0개 이상의 문을 중괄호로 묶은 것. 자바스크립트는 블록문을 하나의 실행단위로 취급

📍 if ...else

조건식의 평가 결과가 true일 경우 if문의 코드가 실행되고 false일 경우 else문의 코드 블록이 실행된다.

let num = 10;
if (num < 20) {
	console.log('true')
} else {
	console.log('false')
}

// 중괄호 안의 코드가 한 줄이라면 중괄호 생략 가능

if(num < 20) console.log('중괄호 생략')

else if

조건식을 추가하여 실행될 코드 블럭을 늘리고 싶을떄 사용됩니다. if, else와는 달리 else if는 2번 이상 사용 가능합니다.

if (num < 20) {
	console.log('20 보다 작은수')
} else if(num = 20){
	console.log('20과 같은수')
}else {
	console.log('20 보다 큰 수')
}

 

📍 삼항연산자

삼항연산자는 if-else 문을 간단하게 표현하는 방법으로 대부분의 if문은 삼항연산자로 전환할 수 있다.

// 조건식 ? 조건식이 참일 때 실행될 코드 : 조건식이 거짓일 때 실행될 코드

// 경우의 수가 2가지
const x = 2;

// if문 
if (x % 2 == 0){
	console.log('짝수입니다.');
} else {
	console.log('홀수입니다.');
}

// 삼항연산자

let result = x % 2 == 0 ? "짝수입니다." : "홀수입니다." ;


// 경우의 수가 3가지
const num = 0;

// 0은 flase 이므로 num이 0 이면 '0' 반환
const result2 = num ? (num > 0 ? '양수' : '음수') : '0';

 

📍 switch 문

switch문의 가장 큰 장점은 가독성이 좋다는 것이다. 주어진 표현식을 평가하고 그 값과 일치하는 표현식을 갖는 case 문의 코드를 실행한다. 만약 일치하는 case가 없다면 실행 순서는 default 문으로 이동한다. (단, default 는 선택사항)

🤔 if문과 차이점은? if문의 조건식은 불리언 값으로 평가되어야 하지만 switch문의 표현식은 문자열이나 숫자 값인 경우가 많다.
if는 참과 거짓을 구별한다면 switch는 다양한 상황에 따라 실행할 코드 블럭을 결정한다.

const value = 'two';

switch (value) {
    case 'one':
        console.log('hello one')
        break;
    case 'two':
        console.log('hello two')
        break;
    case 'three':
        console.log('hello three')
        break;
    default:
        console.log('hello default')
        break;
}

// 'hello two'

🧨 break 를 쓰는이유!

case문은 결과와 일치하는 case문을 실행하지만 문제는 '해당 실행 흐름으로 이동'한다는 것이다. 만약 break로 제동을 걸지 않으면 그 이후에 있는 다른 case의 문들도 순서대로 통과하면서 실행시킨다. 여기서 break는 코드를 탈출하는 역할을 해준다.

단, default 문은 switch의 맨 마지막에 위치하므로 자연스럽게 실행이 종료되므로 break가 필요하지 않다.

'dev > JavaScript' 카테고리의 다른 글

변수 복사 과정은 어떻게 진행될까?  (0) 2023.04.12
DOM과접근법  (0) 2023.04.11
Object  (0) 2023.04.05
Array  (0) 2023.04.05
Number  (0) 2023.04.04

댓글