if문에 대해서 알아보자

1. if문

if문은 주어진 조건이 참이면 특정 코드 블록을 실행하고, 거짓이면 실행하지 않습니다.

참인 조건은 많지만, 거짓인 조건은 다섯 가지가 있습니다.

따라서, 그 다섯 가지의 조건만 외우면 참과 거짓을 구별해서 쓸 수가 있습니다.

 

거짓의 조건은 false, null, undefined, 0, "" 입니다.

차례 대로, 거짓, 제로의, 정의되지 않은, 숫자 0, 빈 문자열 을 뜻합니다.

 

if문의 형태는 다음과 같습니다.

	// false : 0, null, undefined, false, ""(빈 문자열)
    // true : 1, 2, "0", "1", "abc", [ ], { }, true
if(조건식) {
    document.write("실행되었습니다.(true)");
} else {
    document.write("실행되었습니다.(false)");
}
    // 실행되었습니다.(true) 나
    // 실행되었습니다.(false)의 결과가 나온다.

2. if문 생략

if문을 생략해서 쓸 수도 있습니다.

 

예제로 설명하겠습니다.

const num = 100;

if(num) {
    document.write("실행되었습니다.(true)");
} else {
    document.write("실행되었습니다.(false)");
}
	// 100은 거짓의 다섯 가지에 해당되지 않으므로, 참이다.
    // 결과값으로 실행되었습니다.(true) 이 나온다.
    // 위와 같은 식으로, 좀 더 간략하게 쓸 수 있다.
    
if(num) document.write("실행되었습니다.(true)");
else document.write("실행되었습니다.(false)");
    // 실행되었습니다.(true) 나
    // 실행되었습니다.(false)의 결과가 나온다.

조건식으로 100을 지정해주고, 참이면 "실행되었습니다.(ture)"를 출력,

그렇지 않으면 "실행되었습니다.(false)"를 출력하도록 했습니다.

 

100은 0, "", null, undefined, false (거짓의 조건) 가 아니므로 답이 참으로 출력됩니다.

 

생략문은 원래의 if문의 중괄호({})를 생략해서 쓰는 식입니다.

3. 삼항 연산자

삼항 연산자는 if문을 간단하게 표현할 수 있어서 코드를 더욱 간결하게 해줍니다.

 

역시, 예제로 설명하겠습니다.

const num = 100;

if(num == 100) {
    document.write("true");
} else {
    document.write("false");
}
    // true 가 나온다.
    // 위와 같은 식으로, 좀 더 간략하게 쓸 수 있다.
    // 좀 더 효율적이다.
(num == 100) ? document.write("true"): document.write("false");
    // true 가 나온다.

보이는 것처럼 if문은 길게 걸쳐서 써야 하지만, 삼항 연산자는 물음표 기호(?)와 콜론(:)으로 간추려서 쓸 수가 있기 때문에 헷갈리지 않게 잘 외워서 사용하면 유용하게 쓸 수 있습니다.

4. 중첩 if(else if)문

if문은 유용하게 쓰이기 때문에 중첩해서 쓸 수도 있습니다.

여러 조건을 동시에 걸어야 할 때가 있기 때문입니다.

 

예제로 설명하겠습니다.

const num = 100;

if(num == 90) {
    document.write("실행되었습니다(num == 90)");
} else if (num == 100) {
    document.write("실행되었습니다(num == 100)");
} else if (num == 110) {
    document.write("실행되었습니다(num == 110)");
} else if (num == 120) {
    document.write("실행되었습니다(num == 120)");
} else {
    document.write("실행되었습니다")
}
if(num === 90) { }
	// 숫자, 문자, 함수, 객체 등의 구분을 할 수 있다.
    // 결과로는, 실행되었습니다(num == 100)이 나온다.

100이라는 값을 정해주고, 그 조건에 맞는 식이면 출력합니다. 

num == 이라는 조건이 그 값이여야 한다는 뜻이기 때문입니다.

 

따라서, 100의 값과 같다는 뜻의 num == 100 이라는 조건식을 가진 실행되었습니다(num == 100) 이 출력됩니다.

5. 다중 if문

if문 안에 다시 if문이 있는 구조입니다.

 

첫 번 째 조건이 참이면 첫 번 째 if문 안의 코드가 실행됩니다.

만약 첫 번 째 조건이 거짓이고, 두 번 째 조건이 참이면 두 번 째  if문 안의 코드가 실행됩니다.

마지막으로 모든 조건이 거짓이면 else문 안의 코드가 실행됩니다.

 

예제를 보여드리겠습니다.

const num = 100;

if(num == 100) {
    document.write("실행되었습니다.(1)");
    if(num == 100) {
        document.write("실행되었습니다.(2)");
        if(num == 100) {
            document.write("실행되었습니다.(3)");
        }                
    }
} else {
    document.write("실행되었습니다.(4)")
}   
	// if가 true이면 값이 출력되고, else가 false이면 값이 출력된다.
    // 결과로는 실행되었습니다.(1)실행되었습니다.(2)실행되었습니다.(3)이 나온다.

num == 100 이라는 조건식이 걸려있으므로, 100의 값을 가진 식들이 출력됩니다.

따라서 else문을 제외한 모든 값이 출력된 겁니다.