[JavaScript 개념]2. 조건문

조건문?

특정 조건에 따라 실행여부를 따질 때 사용하는 구문이다.

대표적인 조건문으로는 if문과 switch / case문이 있다.

 

🔎조건문 비교하기

	if 문	switch / case문
조건	괄호 안 조건의 결과를 불린형으로 반환	비교값와 case의 값을 일치비교 함(a === b)
사용	간단한 조건일 때	여러조건으로 나눠야 할 때

---

1. if 문

결과가 true일 때 코드를 출력한다.

→ 조건의 결과값이 false일 때는 실행되지 않는다.

 

예시

let num = 10

if(num < 20){
	console.log('num은 20보다 작습니다')
}//'num은 20보다 작습니다'

if(num > 10){
	console.log('num은 10보다 큽니다')
}//실행되지 않음

 

🔎if문의 특징 - 중첩 조건문

if문은 중첩시켜 사용할 수 있다. 

let num = 50;

if (num < 10) {
    console.log('num은 10보다 작습니다.');
} else {
    if (num > 10) {
        console.log('num은 10보다 큽니다.');
    } else {
        console.log('num은 10입니다.');
    }
}

---

1 - 1. if - else문

조건문의 결과가 true일 때는 if의 코드를, false일 때는 else의 코드를 출력한다.

 

예시

let num = 50

if(num <= 10){
	console.log('num은 10보다 작거나 같습니다.')
}else{
	console.log('num은 10보다 큽니다')
}// num은 10보다 큽니다

 

1 - 2. else if 문

여러조건에 따라 서로 다른 코드를 실행해야 할 때 사용한다.

 

예시

let num = 50;

if (num < 10) {
    console.log('num은 10보다 작습니다.');
} else if (num > 10) {
    console.log('num은 10보다 큽니다.');
} else {
    console.log('num은 10입니다.');
}

🚨else는 조건을 쓸 수 없다. else if일 때만 조건 사용 가능

---

2.switch / case문

여러조건에 따라 서로 다른 코드를 실행해야 할 때 사용한다.

🚨 검사해야 하는 조건이 많다면 if문보다는 switch/case문이 유리하다.

 

🔎switch / case문의 문법

구성	설명	특징
case	표현식이나 값이 될 수 있는 선택이 들어가는 키워드( = if)	break를 꼭 포함하고 있어야 함
break	표현식과 값이 일치한다면 break이 있는 코드블록에서 멈추게 한다.
default	일치하는 항목이 없으면 실행되는 기본 옵션 키워드 ( = else)	반드시 포함하지 않아도 됨

 

예시

let fruit = 'apple';

switch (fruit) {
    case 'banana':
        console.log('바나나');
        break;
    case 'orange':
        console.log('오렌지');
        break;
    case 'apple':
        console.log('사과');
        break;
    case 'grape':
        console.log('포도');
        break;
    default:
        console.log('다른 과일');
}//사과

---

2-1. break을 반드시 사용해야 하는 이유

case문 안에 break문이 없으면 조건에 부합하지 않아도 이어지는 모든 case문을 실행한다.

 

예시

let fruit = 'apple';

switch (fruit) {
    case 'banana':
        console.log('바나나');
    case 'orange':
        console.log('오렌지');
    case 'apple':
        console.log('사과');
    case 'grape':
        console.log('포도');
    default:
        console.log('다른 과일');
}
//사과
//포도
//다른과일

---

3. 조건 (삼항)연산자

조건문을 더 짧고 간결하게 변형할 수 있는 연산자.

Javascript 중 3개의 피연산자를 받는 유일한 연산자이다.

 

🔎조건 연산자의 문법

let result = condition ? value1 : value2

🚨조건(condition)이 true면 :의 왼쪽 값(value1)이, false면 :의 오른쪽 값(value2)가 실행된다.

 

3-1.다중 조건 연산자

?를 여러개 연결하면 복수의 조건을 처리할 수 있다.

 

예시

function example(num) {
    return num < 10 ? 'num은 10보다 작음'
         : num > 10 ? 'num은 10보다 큼'
         : 'num은 10입니다';
}

example(20) // num은 10보다 큼

---

4. Truty & Falsy

실제 불린형(true, false)는 아니지만 그러한 취급을 받는 값이다

Falsy(거짓으로 취급되는 값)	Truthy(참으로 취급되는 값)
undefined	Falsy한 값을 제외한 모든 값
null
0
-0
NaN
빈 문자열 ''
0n(BigInt에서 쓰이는 값)

 

 

---

출처
효빈 - 한 방으로 끝내는 자바스크립트 강의
Mordern Javascript Tutorial - https://ko.javascript.info/
Mdn web Docs -https://developer.mozilla.org/ko/