제어문 (Control Flow Statement)
조건에 따라 코드 블록을 실행 (조건문)하거나 반복 실행 (반복문)할 때 사용.
블록문 (Block Statement/Compound Statement)
0개 이상의 문을 중괄호로 묶은 것.
코드 블록 또는 블록 이라고도 부른다.
블록문은 자체 종결성을 갖기 때문에 끝에 세미콜론을 붙이지 않는다.
// 블록문
{
var foo = 10;
}
// 제어문
var x = 1;
if (x < 10) {
x++;
}
// 함수 선언문
function sum(a, b) {
return a + b;
}
조건문 (Conditional Statement)
주어진 조건식 (Conditional Expression)의 평가 결과에 따라 블록 실행을 결정.
조건식이 true면 if 문의 블록이 실행.
false면 else 문의 블록이 실행.
if 문 이후에 else if 문으로 그 다음 조건 설정 가능.
var num = 2;
var kind;
// if 문
if (num > 0) {
kind = '양수'; // 음수를 구별할 수 없다
}
console.log(kind); // 양수
// if...else 문
if (num > 0) {
kind = '양수';
} else {
kind = '음수'; // 0은 음수가 아니다.
}
console.log(kind); // 양수
// if...else if 문
if (num > 0) {
kind = '양수';
} else if (num < 0) {
kind = '음수';
} else {
kind = '영';
}
console.log(kind); // 양수
// x가 짝수이면 result 변수에 문자열 '짝수'를 할당하고, 홀수이면 문자열 '홀수'를 할당한다.
var x = 2;
var result;
if (x % 2) { // 2 % 2는 0이다. 이때 0은 false로 암묵적 강제 변환된다.
result = '홀수';
} else {
result = '짝수';
}
console.log(result); // 짝수
조건에 따라 단순히 값을 결정하여 변수에 할당하는 경우 삼항 연산자가 더 간단할 수 있다.
조건에 따라 실행해야 할 내용이 복잡하고, 여러 줄의 출력이 필요한 경우 if … else 문이 유용할 수 있다.
주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 case문으로 실행 흐름을 이동.
일치하는 case문이 없을 경우 default 문으로 이동.
case문에 break를 지정하지 않을 경우 다음 case문으로 이동하니 주의가 필요.
// 월을 영어로 변환한다. (11 → 'November')
var month = 11;
var monthName;
switch (month) {
case 1: monthName = 'January';
case 2: monthName = 'February';
case 3: monthName = 'March';
case 4: monthName = 'April';
case 5: monthName = 'May';
case 6: monthName = 'June';
case 7: monthName = 'July';
case 8: monthName = 'August';
case 9: monthName = 'September';
case 10: monthName = 'October';
case 11: monthName = 'November';
case 12: monthName = 'December';
default: monthName = 'Invalid month';
}
console.log(monthName); // Invalid month
// 월을 영어로 변환한다. (11 → 'November')
var month = 11;
var monthName;
switch (month) {
case 1: monthName = 'January';
break;
case 2: monthName = 'February';
break;
case 3: monthName = 'March';
break;
case 4: monthName = 'April';
break;
case 5: monthName = 'May';
break;
case 6: monthName = 'June';
break;
case 7: monthName = 'July';
break;
case 8: monthName = 'August';
break;
case 9: monthName = 'September';
break;
case 10: monthName = 'October';
break;
case 11: monthName = 'November';
break;
case 12: monthName = 'December';
break;
default: monthName = 'Invalid month';
}
console.log(monthName); // November
반복문 (Loop Statement)
조건식의 평가 결과가 참인 경우 코드 블록을 실행.
조건이 거짓으로 평가될 때까지 코드 블록을 반복 실행.
for (var i = 0; i < 2; i++) {
console.log(i);
}
for (var i = 1; i <= 6; i++) {
for (var j = 1; j <= 6; j++) {
if (i + j === 6) console.log(`[${i}, ${j}]`);
}
}
조건식의 평가 결과가 참이면 코드 블록을 계속해서 반복 실행.
var count = 0;
// count가 3보다 작을 때까지 코드 블록을 계속 반복 실행한다.
while (count < 3) {
console.log(count); // 0 1 2
count++;
}
// 무한루프
while (true) { ... }
var count = 0;
// 무한루프
while (true) {
console.log(count);
count++;
// count가 3이면 코드 블록을 탈출한다.
if (count === 3) break;
} // 0 1 2
코드 블록을 먼저 실행하고 조건식을 평가.
코드 블록은 무조건 한 번은 실행된다.
var count = 0;
// count가 3보다 작을 때까지 코드 블록을 계속 반복 실행한다.
do {
console.log(count);
count++;
} while (count < 3); // 0 1 2
레이블, 반복문, switch 문 등의 코드 블록을 탈출.
if (true) {
break; // Uncaught SyntaxError: Illegal break statement
}
// foo라는 레이블 식별자가 붙은 레이블 문
foo: console.log('foo');
// foo라는 식별자가 붙은 레이블 블록문
foo: {
console.log(1);
break foo; // foo 레이블 블록문을 탈출한다.
console.log(2);
}
console.log('Done!');
중첩 for문 중 내부 for문에서 break 사용 시, 내부 for문을 탈출.
이때 외부 for문을 탈출하고 싶다면 레이블 문을 사용할 수 있다.
// outer라는 식별자가 붙은 레이블 for 문
outer: for (var i = 0; i < 3; i++) {
for (var j = 0; j < 3; j++) {
// i + j === 3이면 outer라는 식별자가 붙은 레이블 for 문을 탈출한다.
if (i + j === 3) break outer;
console.log(`inner [${i}, ${j}]`);
}
}
console.log('Done!');
하지만 레이블 문은 중첩 for문 외부로 탈출할 경우 유용하지만, 그 밖의 경우는 권장하지 않는다.
반복문의 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동.
var string = 'Hello World.';
var search = 'l';
var count = 0;
// 문자열은 유사배열이므로 for 문으로 순회할 수 있다.
for (var i = 0; i < string.length; i++) {
// 'l'이 아니면 현 지점에서 실행을 중단하고 반복문의 증감식으로 이동한다.
if (string[i] !== search) continue;
count++; // continue 문이 실행되면 이 문은 실행되지 않는다.
}
console.log(count); // 3
// 참고로 String.prototype.match 메서드를 사용해도 같은 동작을 한다.
const regexp = new RegExp(search, 'g');
console.log(string.match(regexp).length); // 3
for (var i = 0; i < string.length; i++) {
// 'l'이면 카운트를 증가시킨다.
if (string[i] === search) count++;
}