모던 자바스크립트 (스터디) 8-1~2장

제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용한다.

 

제어문을 사용하면 순차적으로 흐르던 코드의 실행흐름을 인위적으로 제어할 수 있는데 코드의 실행 순서가 변경된다는 것은 단순히 위에서 아래로 순차적으로 진행하는 직관적인 코드의 흐름을 혼란스럽게 만들어서 가독성이 좋지 않은 코드는 오류를 발생시키는 원인이 된다.

 

블록문

0개 이상의 문을 중괄호로 묶은 것이며, 코드 블록 또는 블록이라고 부르기도 한다. 블록문은 일반적으로 제어문이나 함수를 정의할 떄 사용하는것이 일반적이다.

블록문은 언제나 문의 종료를 의미하는 자체 종결성을 갖기 때문에 블록문의 끝에는 세미콜론을 붙이지 않는것에 주의해야 한다.

{
	var foo = 10;
}

 

조건문

불리언 값으로 평가될 수 있는 표현식

주어진 조건식의 평가 결과에 따라 코드 블록의 실행을 결정한다. 

 

if...else문

조건식의 평가 결과, 논리적으로 참 또는 거짓에 따라 실행할 코드 블록을 결정한다.

if(조건식){
  // true
} else if(조건식){
  // true
} else {
  // false
}

if문과 else 문은 2번이상 사용할 수 없지만 else if 문은 여러 번 사용할 수 있다.

만약 코드 블록 내의 문이 하나뿐이라면 중괄호를 생략할 수 있다.

var name = '유리'
var age;

if (name > '유리') age = '3살'
else if (name > '율') age = '1살'
else age = '29살'

console.log(age) // 3살

대부분의 if ... else문은 삼항 조건 연산자로 바꿔 쓸 수 있다. 삼항 조건 연산자는 값으로 평가되는 표현식을 만든다. 따라서 삼항 조건 연산자 표현식은 값처럼 사용할 수 있기 때문에 변수에 할당할 수 있다. 하지만 if ...else문은 표현식이 아닌 문이기 때문에 변수에 할당할 수 없다.

 

switch 문

주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 case문으로 실행 흐름을 옮긴다. 

case문은 상황을 의미하는 표현식을 지정하고 코론으로 마치고 그뒤에 실행할 문들을 위치시킨다.

 

일치하는 case문이 없다면 실행순서는 default문으로 이동한다. default문은 선택사항으로 사용하지 않을 수도 있다.

swich(표현식){
	case 표현식1:
    	switch 문의 표현식과 표현식1이 일치하면 실행될 문;
    	break;
    default:
    	switch 문의 표현식과 일치하는 case문이 없을 떄 실행되는 문;
}

switch 문은 논리적 참, 거짓보다는 다양한 상황에 따라 실행할 코드 블록을 결정할 때 사용한다.

var age = 3
var name;

switch (age){
	case 1:name = '나무';
	case 2:name = '풀';
	case 3:name = '유리';
	case 4:name = '꽃';
	default:name = '공주';
}

console.log(name); // 공주

위 예제를 실행해 보면 '유리'가 출력되지 않고 '공주'가 출력된다. 이는 switch문을 탈출하지 않고 switch문이 끝날 때까지 이후의 모든 case문과 default문을 실행했기 떄문이다. 이를 폴스루라 한다. name변수에 '유리'가 할당된 후 switch문을 탈출하지 않고 연이어 '꽃'이 재할당되고 마지막으로 '공주'가 재할당된 것이다.

 

이러한 결과가 나온 이유는 case문에 해당하는 문의 마지막에 break문을 사용하지 않았기 때문이다.

break문은 코드 블록에서 탈출하는 역할을 한다. break문이 없다면 case문의 표현식과 일치하지 않더라도 실행 흐름이 다음 case문으로 연이어 이동한다. 

 

default문의 실행이 종료되면 switch문을 빠져나가서 별도로 break문이 필요 없다.

 

break문을 생략한 폴스루가 유용한 경우도 있다.

윤년을 판별할때는 동일한 값을 주는 1, 3, 5, 7,8,10,12월일 경우 break문을 사용하지 않고 마지막에 변수에 할당하고 나서 break를 걸어준다.

 

만약 if ...else 문으로 해결할 수 있다면 switch문보다 if...else문을 사용하는 편이 좋다. 하지만 조건이 너무 많아서 if...else문보다 switch문을 사용했을 때 가독성이 더 좋다면 switch문을 사용하는편이 좋다.