[JavaScript] 5. 조건문( if/switch )

# 제어문  

프로그램의 순차적인 흐름을 제어해야 할 때 사용하는 실행문을 의미합니다. 

 

● 조건문

프로그램 내에서 주어진 조건문의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문입니다.

 

1) if문 : 범위에 대한 조건식을 사용할 때 유리
2) switch문 : 특정 값과 일치하는 값을 찾을 때 유리

 

 

1. if 문 

조건식의 결과가 참(true)이면 주어진 실행문을 실행하고, 거짓(false)이면 아무것도 실행하지 않는 문장입니다. 

 

if(조건식){
        조건식의 결과가 차일 때 실행할 문장;
        ...
}

 

예시)

<script>
        "use strict"
        const age = Number(prompt('나이를 입력하세요.'));
        if(age >= 19){
            console.log('성인입니다.');
        }
</script>

▼▼▼

 

 

2. if ~ else 문 

if 문과 같이 사용할 수 있는 else문은 if문의 조건식의 결과가 거짓(false) 일 때 실행문을 실행합니다.

 

if(조건식){
        조건식의 결과가 참일 때 실행할 문장;
}else{
        조건식의 결과가 거짓일 때 실행할 문장;
}

 

예시)

<script>
        'use strict'
        const age = Number(prompt('나이를 입력하세요.'));
        if(age >= 19){
            console.log('성인입니다.');
        }else{
            console.log('미성년입니다.');
        }
</script>

▼▼▼

 

 

3. if ~ else if ~ else 문 

else if문은 if문처럼 조건식을 설정할 수 있으므로 중첩된 if문을 좀 더 간결하게 표현할 수 있습니다. 하나의 조건문 안에서 if문과 else문은 단 한 번만 사용할 수 있습니다. 하지만 else if문은 여러 번 사용하여 다양한 조건을 설정할 수 있습니다. (단, else문은 생략 가능)

 

if(조건식1){
        조건식1의 결과가 참일 때 실행할 문장;
} else if(조건식2){
        조건식2의 결과가 참일 때 실행할 문장;
} else if(조건식3){
        조건식3의 결과가 참일 때 실행할 문장;
}
...
else {
        모든 조건식의 결과가 거짓일 때 실행할 문장;
}

 

예시)

<script>
        'use strict'
        const age = Number(prompt('나이를 입력하세요.'));
        if(age >= 19){
            console.log('성인입니다.');
        }else if(age >= 14){
            console.log('청소년입니다.');
        }else if(age >= 7){
            console.log('어린이입니다.');
        }else{
            console.log('유아입니다.');
        }
</script>

▼▼▼

▼▼▼

 

 

4. switch 문 

switch문은 if~else 문과 마찬가지로 주어진 조건 값에 따라 프로그램이 다른 명령을 수행하도록 하는 조건문입니다. switch문은 if~else문 보다 가독성 및 속도 측면에서 더 유리합니다. 

 

switch(비교값){ 
        case 값1: 
                비교값이 값1과 일치할 경우 실행할 문장; 
                break; 
        case 값2: 
                비교값이 값2과 일치할 경우 실행할 문장; 
                break; 
        case 값3: 
                비교값이 값3과 일치할 경우 실행할 문장; 
                break; 
        ... 
        default:(생략가능) 
                비교값이 모두 일치하지 않을 경우 실행할 문장; 
}

 

 

예시 ) 

<script>
        'use strict';
        let input = prompt('아동, 청소년, 성인 중 선택하세요.');
        switch(input){
            case "아동":
                input += " : 입장료 무료"; // "아동 : 입장료 무료"
                break;
            case "청소년":
                input += " : 입장료 2000원";
                break;
            case "성인":
                input += " : 입장료 5000원";
                break;
            default:
                alert('입력값을 확인하세요.');
                input = "입력 값을 확인하세요.";
        }
        console.log(input);
</script>

▼▼▼

▼▼▼

▼▼▼

 

 

문제)

아래와 같은 형식의 입력을 받아 출력 예시와 같이 프로그램을 작성해보자.
(단, 학점은 평균을 기준으로 90점 이상 A학점, 80점 이상 B학점, 70점 이상 C학점, 60점 이상 D학점, 그 외 F학점)

입력 예시 ) prompt 입력 
이름을 입력하세요. 
HTML 점수를 입력하세요. 
CSS 점수를 입력하세요. 
JavaScript 점수를 입력하세요. 

출력 예시 ) console로 출력 
홍길동 님의 성적 
HTML : 
CSS : 
JavaScript :
총점 : 
평균 : 
학점 :

 

<h2>학생 성적 관리 프로그램</h2>
    <script>
        "use strcit"
        const name = prompt("이름을 입력하세요.");
        const num1 = Number(prompt("HTML점수를 입력하세요."));
        const num2 = Number(prompt("CSS점수를 입력하세요."));
        const num3 = Number(prompt("JavaScript점수를 입력하세요."));
        const total = num1 + num2 + num3;
        const avg = total / 3;
        let hak = "";

		/* if 문 */
        if(avg >= 90){
            hak = "A";
        }else if(avg >= 80){
            hak = "B";
        }else if(avg >= 70){
            hak = "C";
        }else if(avg >= 60){
            hak = "D";
        }else{
            hak = "F";
        }
        
        /* switch문 */
        switch(parseInt(avg/10)){
            case 10: case 9:
                hak = "A";
                break;
            case 8:
                hak = "B";
                break;
            case 7:
                hak = "C";
                break;
            case 6:
                hak = "D";
                break;
            default:
                hak = "F";
                break;
        }

        console.log(`${name}님 성적표`);
        console.log(`HTML : ${num1}점`);
        console.log(`CSS : ${num2}점`);
        console.log(`JavaScript : ${num3}점`);
        console.log(`총점 : ${total}점`);
        console.log(`평균 : ${avg}점`);
        console.log(`학점 : ${hak}점`);
</script>

▼▼▼