본문 바로가기
JS 공부

JS 개념정리 03 - 조건문, 물음표연산자, switch문

by 나노다 2024. 10. 25.

조건문

  • if문 : ()안의 조건이 참이면 {}안의 구문을 실행함. 구문이 하나더라도 중괄호를 쓰는 편이 가독성 좋음
  • else절 : if문의 조건이 거짓일 경우 실행됨
  • else if : 여러 조건을 확인해야 할 때 활용. 마지막에 else를 붙일지 말지는 선택사항

 

조건부 연산자

  • ? : 물음표 연산자라고도 하고, 피연산자가 세 개기 때문에 삼항(ternary) 연산자라고도 함. 조건에 따라 다른 값을 변수에 할당해야할 때 활용. 조건을 감싸는 소괄호는 안 써도 무방하지만 가독성을 위해 사용하는 편이 좋음
/* 기본 구조 */
변수 선언 = (조건) ? (true면 반환할 값) : (false면 반환할 값)

/* 예제 */
let score = 95;
let isPassTest = (score >= 90) ? "pass" : "fail";
console.log(isPassTest); // 출력 : "pass"
  • 다중 ? : 물음표 연산자를 여러 개 연결해 복수의 조건을 처리할 수 있음. else if와 유사한 쓰임
/* 다중? 예제 */
let ScoreA = 80;
let ScoreB = 89;
let ScoreC = 92;
let isPass = (ScoreA >= 85) ? "pass" : // 여기가 첫 if
             (ScoreB >= 85) ? "pass" : // 여기가 첫 else if
             (ScoreC >= 85) ? "pass" : // 여기가 두 번째 else if
             "fail";                   // 여기가 else의 기능과 유사함
console.log(isPass); // 출력 : "pass", 세 과목 중에 하나라도 85점 이상이면 패스기 때문

 

▼ 부적절한 물음표 연산자

더보기

 물음표 ?는 하나의 변수에 조건 상황에 따라 다른 값을 할당하기 위해 사용하는 데에만 활용하는 편이 좋음. 코드의 길이를 줄이겠다고 if문 대용으로 막 사용하면 오히려 가독성을 해칠 수 있음. 여러 분기를 만드는 처리를 할 때엔 꼭 if문을 쓰도록 하자

switch - case문

 복수의 조건문을 나타낼 때 활용. 하나의 특정 변수를 다양한 상황에서 비교할 수 있고, 비교 상황이 한눈에 잘 들어온다는 장점이 있음. default문은 else처럼 선택사항임

/* 기본 구조 */
switch(변수명) {
	case 값1:
    	값1과 변수가 일치하면 실행할 구문;
        break;
    case 값2:
    	값2와 변수가 일치하면 실행할 구문;
        break;
    default:
    	이전의 비교에서 변수와 일치하는 값이 없으면 실행할 구문;
        break;
}

/* 예제 */
let myName = "song"
switch(myName) {
    case "kim":
    	console.log("wrong!");
        break;
    case 5:
    	console.log("different type error")
        break;
    default:
    	console.log("you failed");
        break;
} // 출력 : "you failed", case1은 값이 다르므로 불일치, case2는 자료형이 다르므로 불일치

 

▼ case문 중간중간에 break가 없으면 생기는 일

더보기

 조건 부합 여부를 따지지 않고 case문 안의 구문을 다 실행해 버림

let myName = "song"
switch(myName) {
    case "kim":
    	console.log("wrong!");
    case 5:
    	console.log("different type error")
    default:
    	console.log("you failed");
} 
/* 셋 다 출력해버림 */
"wrong!"
"different type error"
"you failed"

switch문 심화

  • 실행할 구문이 동일하다면, 여러 case를 묶어서 표현할 수 있음. break문이 없는 상황의 특성 때문
let myName = "song"
switch(myName) {
    case "kim": // "kim" case와 5 case를 묶음
    case 5:     // 비교가 일치하면 둘 모두 "wrong!"을 출력
    	console.log("wrong!");
    default:
    	console.log("you failed");
}
  • switch문에서의 일치 비교는 자료형까지 확인하는 엄격한 비교임
let myNum = "3";
switch(myNum) {
    case 3: // 자료형이 다르기 때문에 불일치
        console.log("wrong!");
        break;
    case "3":
        console.log("correct!");
        break;
}

'JS 공부' 카테고리의 다른 글

JS 개념정리 05 - 배열 관련 메서드  (0) 2024.10.26
JS 개념정리 04 - 배열  (0) 2024.10.25
JS 개념정리 02 - 연산자  (0) 2024.10.25
JS 개념정리 01 - 소개, 변수, 자료형  (0) 2024.10.24
freecodecamp 정리 [JS 21~70]  (1) 2024.10.19