티스토리 뷰

Javascript

조건문

Front_end 2022. 1. 31. 23:56

조건문

조건문은 조건식의 값이 참(true)인지, 거짓(false)인지에 따라 자바스크립트 코드를 제어합니다.

if문

if문은 조건식을 만족(true)할 경우에만 코드를 실행합니다. 조건식은 Boolean() 내장 메서드와 마찬가지로 그 어떤 데이터를 입력해도 true 또는 false를 반환합니다.

if(조건식){
    자바스크립트 코드;
}

예제

var num=10;
    if(num<(500){ //true를 반환합니다.
        document.write("hello");
}

조건식에 논리형 데이터가 아닌 다른 형이 오는 경우

조건식에 논리형 데이터(true, false)가 아닌 다른 형의 데이터가 입력되어도 true 또는 false로 인식 됩니다.

0, null, ""(빈문자), undefined

조건식이 출력되는경우

var num=3;
if(num){ //3은 true입니다.
    document.write(num);
}

출력되지 않는 경우

var num=0;
if(num){ //0은 false입니다.
    document.write(num);
}

else 문

else 문은 조건식을 만족할(true) 경우와 만족하지 않을(false) 경우에 따라 실행되는 코드가 달라집니다. 즉, 두 가지 결과가 나올 수 있습니다.

기본형

if(조건식){
    자바스크립트 코드1;
}else{
    자바스크립트 코드2;
}

예제 (방문자에게 질의응답 창으로 좋아하는 숫자를 입력받고 if~else문을 사용하여 입력된 값이 짝수인지, 홀수인지에 따라 출력되는 결과가 다르게 나타나도록 하였습니다.)

<script>
    var num = prompt("당신이 좋아하는 숫자는?", "0");
    
    if(num % 2 == 0) {      //짝수일 경우에 실행
        document.write("당신이 좋아하는 숫자는 짝수입니다.");
    } else {
        document.write("당신이 좋아하는 숫자는 홀수입니다.");
    }
</script>

else if문

else if문은 두 가지 이상의 조건식과 정해 놓은 조건을 만족하지 않았을 때 실행되는 코드로 이루어져 있습니다.

기본형 (가장 위에 있는 조건식1부터 5까지 차례로 조건 검사를 하면서 만족(true)하는 값이 나오면 그에 해당하는 코드를 실행하고 조건문을 종료합니다. 조건식 중 만족(true)하는 값이 하나도 없으면 else문의 중괄호{}에 있는 코드를 실행합니다.)

if(조건식1){
    코드1;
} else if(조건식2){
    코드2;
} else if(조건식3)
    코드3;
} else if(조건식3)
    코드4;
} else if(조건식3)
    코드5;
} else if(조건식3)
    코드6;
}

예제 (질의응답 창을 이용하여 "현재는 몇 월입니까?"를 묻고, else if 문을 사용해 현재 월에 해당하는 계절과 관련된 문구가 출력되도록 작성한 예제입니다.)

<script>
    var mon = prompt("현재는 몇 월입니까?", "0");

    if(mon >=9 && mon <=11){             // 9 ~ 11
        document.write("독서의 계절 가을이네요!!");
    } else if(mon >=6 && mon <=8){      // 6 ~ 8
        document.write("여행가기 좋은 여름이네요!!");
    } else if(mon >=3 && mon <=5){      // 3 ~ 5
        document.write("햇살 가득한 봄이네요!!");
    } else {                                           // 나머지 입력
        document.write("스키의 계절 겨울이네요!!");
    }
</script>

중첩 if문

조건문 안에 조건문이 있으면 중첩if문이라고 합니다.

기본형

if(조건식1){
    if(조건식2){
        자바스크립트 코드;
    }
}

중첩if 문은 바깥쪽에 있는 조건문인 조건식1을 만족해야만 안쪽에 있는 조건문인 조건식2를 검사합니다. 만일 안쪽 if문의 조건식2를 만족하지 않으면 바깥쪽 조건문인 조건시1의 중괄호 안에 있는 코드만 실행하고 종료됩니다.

예제

{
    const num = 100;

    if(num == 100){
        document.write("실행되었습니다(1)");    //실행되었습니다(1)
        if(num ==100){
            document.write("실행되었습니다(2)");    //실행되었습니다(2)
            if(num ==100){
                document.write("실행되었습니다(3)");    //실행되었습니다(3)
            }
        }
    } else {
        document.write("실행되었습니다.(4)");
    }                    //결과 실행되었습니다(1) 실행되었습니다(2) 실행되었습니다(3)
}

'Javascript' 카테고리의 다른 글

함수  (1) 2022.02.03
반복문  (1) 2022.02.03
자바스크립트 연산자  (0) 2022.01.31
자바스크립트 자료형  (0) 2022.01.27
변수는 무엇일까?  (0) 2022.01.27
댓글
© 2018 webstoryboy