자바스크립트 기초 ep.6 - 조건문(if, switch)과 삼항연산자

조건문은 특정 조건에 따라 특정 코드를 수행하는 문법입니다. 삼항연산자는 조건식이 간단할 때 조건문을 한줄로 작성 가능한 방법입니다.

 

 

자바스크립트 조건문(if, swift)와 삼항연산자 사용

자바스크립트의 조건문은 다른 프로그래밍 언어와 마찬가지로 특정조건이 참인 경우 특정코드를 수행하는 문법입니다. 조건문에는 if, switch 문이 있으며, 간단한 조건문은 삼항연산자로 대체할 수 있습니다.

 

• if ...else 문
• switch 문
• 삼항 연산자

 

 

if ...else 문

if 문은 대부분의 프로그래밍 언어에서 사용되는 대표적인 조건문입니다. 

 

// 조건식이 참이면 수행
if(조건식) {
    조건식이_참일_때_수행할_코드
    조건식이_참일_때_수행할_코드
}

 

조건식이 참이고 수행할 코드가 1줄이면 중괄호를 생략할 수 있습니다.

 

// 조건식이 참이고 코드가 1줄일 경우 중괄호 {} 생략가능
if(조건식) 
    조건식이_참일_때_수행할_코드

 

if 문의 조건식이 참이 아닐 경우, else 를 추가하여 코드를 실행할 수 있습니다.

 

// 조건식이 참이면 if 의 중괄호, 참이 아니면 else의 중괄호 수행
if(조건식) {
    조건식이_참일_때_수행할_코드
    조건식이_참일_때_수행할_코드
}
else {
    조건식이_참이_아닐때_수행할_코드
    조건식이_참이_아닐때_수행할_코드
}

 

마찬가지로 코드가 1줄일 경우 else 뒤의 중괄호를 생략할 수 있습니다.

 

// 조건식이 참이고 코드가 1줄일 경우 중괄호 {} 생략가능
if(조건식) 
    조건식이_참일_때_수행할_코드
else
    조건식이_참이_아닐때_수행할_코드

 

다수의 조건에 따라 분기할 수 있도록 else if 문이 존재합니다. else if는 개수에 제한이 없습니다.

 

 // else if
 if(조건식1){
    조건식1이 참일 때 수행할 코드 
}
else if(조건식2){
    조건식2이 참일 때 수행할 코드
}
else if(조건식3){
    조건식3이 참일 때 수행할 코드
}
...
else {
    만족할 조건이 없을 때 수행할 코드
}

 

if 문은 중첩할 수 있습니다.

 

// 조건식이 참이면 if 의 중괄호, 참이 아니면 else의 중괄호 수행
if(조건식) {
    조건식이_참일_때_수행할_코드
    // 조건문 중첩사용
    if(조건식1) {
    	조건식1이_참일_때_수행할_코드
    }
    else {
    	조건식1이_참이_아닐때_수행할_코드
    }
}
else {
    조건식이_참이_아닐때_수행할_코드
}

 

점수에 따라 등급을 출력하는 예시코드 입니다.

 

// 점수에 따라 등급 출력
var grade = 91;

if (grade > 100) {
    console.log("잘못 입력하셨습니다.");
}
else if (grade >= 90){
    console.log("A 입니다.");
}
else if (grade >= 80){
    console.log("B 입니다.");
}
else if (grade >= 70){
    console.log("C 입니다.");
}
else if (grade >= 60){
    console.log("D 입니다.");
}
else if (grade >= 0){
    console.log("F 입니다.");
}
else {
    console.log("잘못 입력하셨습니다.");
}

 

아래는 결과입니다.

 

등급 출력 코드 결과

 

 

switch 문

복수의 if문을 사용해야 할 경우 switch 문으로 대체할 수 있습니다. switch 문은 switch 문 ()에 들어갈 변수가 어떤 값을 가지냐에 따라 case를 분기하는 문법입니다.

 

switch 문에서 각 case 에 break (중괄호 {} 탈출) 를 사용해야 해당 case의 코드만 실행됩니다. default는 아무런 조건을 만족시키지 못할 경우 실행됩니다.

 

// switch: 값에 따른 분기를 수행하는 방법
var color = "red";

// color 가 어떤 색을 입력받았나에 따른 case 문장 실행
switch(color){
    case "red":   
    	console.log("빨간색"); 
        break;	// switch문 탈출
    case "green": 
    	console.log("초록색"); 
        break;
    case "blue":  
    	console.log("파란색"); 
        break;
    default:   // 만족하는 case가 없는 경우 실행      
    	console.log("잘못입력");
}

 

아래는 결과 입니다.

 

switch 결과

 

switch 문에서 각 case 에 break (중괄호 {} 탈출) 를 사용하지 않으면 다음 case가 실행됩니다. 이를 fall-through 라고 합니다. fall-through는 다수의 값에 대한 분기를 의도적으로 넘어가기 위해 제공하는 기능입니다.

 

var num = Number(prompt("자연수 입력(1~10):"));

// 의도적으로 case를 넘겨 사용. fall-through
    switch(num){
        case 1:
        case 3:
        case 5:
        case 7:
        case 9:
            console.log("홀수");
            break;
        case 2:
        case 4:
        case 6:
        case 8:
        case 10:
            console.log("홀수");
            break;
        default: 
            console.log("잘못 입력");
    }

 

 

삼항 연산자

조건문이 간결할 경우 삼항연산자로 표현할 수 있습니다. 삼항연산자는 3개의 항(조건문, 선택문1, 선택문2)으로 연산을 처리합니다.

 

// 삼항 연산자: 조건식 ? 참일 때의 선택문1 : 거짓일때의 선택문2
var num = 1;
var result = (num===0) ? "0 입니다" : "0이 아닙니다";
console.log(result);

 

삼항 연산자를 사용하면 별도의 함수를 만들 필요없이 코드를 간결하게 표현할 수 있습니다.

 

삼항연산자 결과

 

 

마무리

코딩을 해보셨다면 조건문을 많이 사용해보셨을 겁니다. 여기에 삼항연산자를 활용해 조건문을 간결하게 한다면 코드 해독성이 증가할 것이라 기대합니다.

 

오늘도 행복한 코딩생활 되시기 바라겠습니다. 감사합니다.