제어문(control flow statement)
제어문은 조건문, 반복문 등을 포함하고 있으므로, 조건문을 알아보기 전에 제어문이 무엇인지 알아보도록 한다.
제어문을 사용하면 위에서 아래로 순차적으로 실행되는 코드의 실행 순서를 인위적으로 제어할 수있다.
조건문이란? (conditional statement)
조건문은 특정 조건을 판별하는 기준(조건식)을 만들어 그 기준이 참인지 아닌지 판별한 평가결과에 따라 블록문의 실행여부를 결정하는 것이다. 조건식은 불리언(boolean)값, 참(true)와 거짓(false)로 평가될 수 있는 표현식이다.
다시 생각하기 - 조건문의 (조건)은 항상 불리언 값 (조건)은 true, false로 봐라! true면 실행되는 것! false 면 실행안되는 것!
조건문은 if문과 switch문을 통해 구현할 수 있는데 어떤 경우에 어떤 조건문을 사용하는 게 좋을까?
if문은 조건식은 불리언값으로 평가되어야 하지만, switch 문의 표현식은 문자열, 숫자 값인 경우가 많아 논리적 참. 거짓보다는 다양한 상황에 따라 실행한 코드블록을 결정할 때 사용한다.
이러한 조건식의 참과 거짓을 판별하기 위해 조건식의 참과 거짓을 판별하기 위해 비교연산자를 사용한다.
-> 비교연산자, 삼항연산자, 논리연산자
비교연산자
| 종류 | 정의 | 설명 |
|---|---|---|
| === | 같다 | 왼쪽 피연산자와 오른쪽 피연산자의 값이 같고, 같은 타입이면 참을 반환. |
| !== | 다르다 | 왼쪽 피연산자와 오른쪽 피연산자의 값이 같지 않거나, 타입이 다르면 참을 반환. |
| > | 초과 | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크면 참을 반환함. |
| < | 미만 | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크면 참을 반환함. |
| >= | 이상 | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크거나 같으면 참을 반환함. |
| <= | 이하 | 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작거나 같으면 참을 반환함. |
| != / == | 다르다 / 같다 | 타입을 엄격하게 비교하지 않아서 웬만하면 사용하지 않는다. |
조건문의 기본 문법 (if .. else)
조건식을 판별하기 위해 비교연산자를 활용하여 조건식의 참과 거짓을 판별한다고 설명하였는데, 이러한 조건문은 어떻게 작성되는지 기본 문법에 대해 알아본다.
- if : 조건식을 만족할 경우에만 { }에 지정한 실행내용이 실행된다.
- else if : 조건식이 2가지 이상이 있다. 앞선 조건을 통과지 못했을 경우 실행될 다음 조건을 지정할 때 마다
사용되며, 통과하는 조건식의 { } 에 지정한 실행내용이 실행된다.- else : 앞에 조건식을 모두 통과하지 않은 경우, else에 있는 { } 에 지정한 실행내용을 실행한다.
// if 조건문 기본형 // 조건을 1개만 지정한다면?
// (조건식1)이 통과할 경우,즉 조건이 참인 경우
if (조건식1) {
// { }코드블록에 지정한 실행내용이 실행된다.
} // 조건이 통과되지 않을 때 false를 리턴하거나 조건에 맞지않는 값을 출력한다.
// else if 문 // 조건을 여러개 지정할때
// (조건식1)이 통과하지 않은 경우,즉 조건이 false인 경우
if (조건식1) {
// { }코드블록의 내용이 실행되지 않는다.
}
else if (조건2) { // (조건식1)이 통과하지 않고 (조건식2)의 조건이 true인 경우
// { }코드블록에 지정한 실행내용이 실헹
}
// else 문
// (조건1)과 (조건2)가 모두 통과되지 않은 경우,
if (조건1) {
}
else if (조건2) {
}
else {
// else { } 코드블록에 지정한실행내용에 따라 실행된다.
} 예시) 알맞은 목욕탕 출입할 수 있는 성별 조건에 따라 => 출력되는 말 다르게 설정하기
function 조건문재현(age){ // age변수에 나이가 전달된다.
// 성인일 경우
if (age > 19) {
return "술을 구매할 수 있습니다."
}
// 미성년자일 경우
else if (age <= 19){
return "미성년자는 술 구매가 불가능 합니다."
}
// else if로 조건을 적었지만 사실, 19세 초과나이를 제외한 모든 범위의 나이여서 => else문으로 바로 처리해도된다.
// else {
// return "미성년자는 술 구매가 불가능 합니다."
// }
}
console.log(조건문재현(ega)) // 입장하는 ega 나이에 따라 함수를 실행하여 조건에 맞는 값을 리턴한다.두가지 조건을 동시에 적용시키는 조건문 문법
위의 기본문법은 조건을 순차적으로 참과 거짓을 판별하는 문법인데, 조건을 한번에 적용시킬 수 도 있다.
조건을 동시에 적용시키기 위해서는 if 이중 중첩문과 논리연산자를 활용한 조건문 2가지 경우로 나뉘어진다.
-> 논리연산자
논리연산자를 활용한 조건문
논리연산자
| 종류 | 이름 | 실행조건 |
|---|---|---|
| && | And 연산자 | 두 조건을 모두 통과해야 조건식이 참이다. |
| ㅣㅣ | or 연산자 | 두 조건 중 하나의 조건만 통과해도 참이다. (shift + \ 를 누르면 입력된다.) |
| ! | Not 연산자 | 반전을 시키는 연산자! 조건 앞에 ! 붙여, 조건의 true과 false의 값을 반전시킨다. |
// 두 조건을 모두 통과해야 true 실행되는 조건문
// 학생이면서, 여성일때 통과
inStudent && isFemale;
// 두 조건 중 한가지만 통과해도 true가 실행되는 조건문
// 학생이거나, 여성일 때 통과
inStudent || isFemale;
// 조건을 반전시킨다.
// 학생이 아니면서, 여성일때 통과해야 실행되는 조건문
!inStudent && isFemale if 이중중첩문을 활용한 조건문
- if 문 안에 if 문이 들어있는 것을 이중중첩문이라고 한다.
- 이중중첩문은 바깥쪽에 있는 조건식1을 통과해야지만 안에 들어있는 조건식2을 실행한다.
- 바깥쪽에 있는 조건식1을 통과하지 못할 시에는 안에 들어있는 조건식2는 실행되지 않는다.
이때 조건식 1의 {}에 해당되는 실행내용(코드)만 실행된다.
//기본형
if (조건식1) {
if (조건식2) {
실행내용 (코드작성)
}
}
// 예시
if (userId === estell){ // 만약 아이디가 estell이면 아래 if문을 실행, 아니면 실행하지 X
if (password === 12345) { // 바깥 조건식이 통과하면, 실행된다.
return '로그인 되었습니다' // 비번이 12345를 입력한다면 조건식을 통과하면 '로그인 되었습니다'출력
} else { // 만약 아이디가 estell인데, 비번을 틀리게 입력했다면?
return '비밀번호가 일치하지 않습니다.'
} // 안에 if문은 실행되지 않고,
// 바깥의 if 문의 { } 내 "비밀번호가 일치하지 않습니다" 문구가 출력된다.
// 바깥 조건문 if문의 { } 내에 현재는 else문이 작성되어 있다.
Switch 문
조건이 많을 경우 if문 보다 switch 문을 사용하는 것이 좋습니다.
if 문은 차례대로 하나하나 비교하며 조건에 맞는 값을 찾지만, switch 문은 이미 지정한 case를 보고 해당 조건의 값을 출력하기 때문입니다.
switch 문과 case 문의 표현식이 일치하면, break 를 만나 switch문을 종료시킨다.
defuault 문은 switch문의 가장 마지막에 위치하므로 defuault 문의 실행이 종료하면 switch 문을 빠져나간다.
따라서 break 를 생략하는 것이 일반적이다.
let buy = '치킨'; // 예를 들어 변수 buy의 값이 '치킨'일때
switch (sell)
{
case '피자':
console.log('피자 구매');
break;
case '보쌈':
console.log ('보쌈 구매');
break;
case '치킨':
console.log ('치킨 구매'); // '치킨 구매'
// switch 문과 일치한 case '치킨'만 실행됨.
break;
default: // switch문의 표현식과 같은 case문이 없을 때 실행된다.
console.log('치킨은 없어요');
// break; 생략하는게 일반적
}case 문 다음에 break 가 없다면?
break 의 역할 : switch 문을 끝내고 { } 코드블록 을 탈출하는 것
break가 없다면 switch 문과 일치한 case문을 만나도 모든 case문이 실행되고 default값 까지 실행된다.
이를 폴스루(fall through) 라 하는데, 폴스루를 활용하여 여러개의 case문을 하나의 조건으로 사용할 수도있다.
참조
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/switch
코드스테이츠
✏️ 추가 학습
- if 이중중첩문의 작동원리가 헷갈리는 부분이 있어서, 활용한 다른 문제들을 풀어보며 작동원리를 이해한다.
- break가 없는 폴스루를 활용하여 여러개의 case문을 하나의 조건으로 사용하는 방법을 알아본다.
