10. JS의 제어문

 

👀  제어문?

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

일반적으로 코드는 위에서 아래 방향으로 실행되지만

제어문을 사용하면 코드의 실행흐름을 인위적으로 제어 가능하다.

 

코드의 실행 순서가 중간에 변경된다는 것은 가독성을 해치는 단점이 되기도 하지만

바르게 이해하는것은 코딩 스킬에 많은 영향을 주기때문에 알아야한다.

 

👀  블록문

블록문은 0개 이상의 문을 중괄호{}로 묶은 것.

JS에서는 블록문을 하나의 실행 단위로 취급한다.

 

보통 블록문은 제어문이나 함수를 정의할때 사용한다.

 

👀  조건문

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

조건식은 불리언 값으로 평가될 수 있는 표현식이다.

 

조건문에는

1. if문

2.switch문

이렇게 2가지가 있다.

 

🟣 if~ else문

논리적 참 또는 거짓에 따라 실행할 코드 블록을 결정한다.

조건식의 평가 결과가 true일때 if문의 코드 블록을 실행,

false일땐 else문의 코드 블록을 실행한다.

 

그리고 조건에 따라 실행될 코드 블록을 늘리고 싶을땐 else if문을 사용한다.

if(조건식1){
	// 조건식1이 참이면 이 코드블록이 실행.
}
else if(조건식2){
	// 조건식2가 참이면 이 코드블록이 실행.
}
else{
	// 조건식이 거짓이면 이 코드블록이 실행.
}

else if, else문은 옵션이다.

그리고 else if문은 여러번 사용 가능하다.

 

보통 조건식이 불리언 값으로 평가되어야 하는데 불리언이 아닌값으로 평가될때는

JS엔진에 의해 암묵적으로 불리언 값으로 강제 변환된다.

 

if문은 아래 예시처럼 삼항연산자로 바꿔쓸수도 있다.

var x = 2;

var result = x % 2? '홀수' : '짝수';
console.log(result) // 짝수

삼항연산자는 [ 조건식? true일때 값 : false일때 값 ] 이런식으로 쓰인다.

 

🟣 switch문

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

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

switch문의 표현식은 불리언 값보다는 문자열, 숫자 값인 경우가 많다.

그래서 다양한 상황에 따라 실행할 코드 블록을 결정할 때 사용한다.

 

👀  반복문

조건식의 평가 결과가 참인 경우 코드 블록을 실행.

그 후 조건식의 평가를 조건식이 거짓일때까지 반복한다.

 

JS에서 반복문은

1. for문

2. while문

3. do... while문

3가지가 있다. 

 

🟣 for문

for문은 조건식이 거짓으로 평가될 때까지 코드 블록을 반복 실행한다.

for문은 매우 중요하다.( 꼭 이해하고 넘어가기! )

 

1. for문 단독으로 쓰기

for(변수 선언문 또는 할당문; 조건식; 증감식){
	조건식이 참일 경우 반복 실행될 문;
}

for(let i=0; i<2; i++){
	console.log(i);
}

풀어서 이야기하기
for(i는 0부터 시작하고; i는 2미만일때까지 반복하고; 반복될때마다 i는 1씩 증가한다;){
	console.log(i) // 0, 1까지 반복하고 i는 2미만일때까지 조건에 걸려서 멈춘다.
}

for문의 변수 선언문, 조건식, 증감식은 모두 옵션이다.

하지만 어떤식도 선언하지 않으면 무한루프에 빠지기 때문에 주의해야한다.

 

2. for문 중첩으로 쓰기

for문 내에 for문을 중첩해서 쓸 수 있다.

 

아래 예시는 두개의 주사위를 던졌을때 두 눈의 합이 6이 되는 모든 경우의 수를 구하는 이중 중첩 for문.

for(let i=0; i <= 6; i++){
	for(let j=1; j <= 6; j++){
	    if(i + j === 6) console.log(`[${i}, ${j}]`);
	}
}

// [1,5]
// [2,4]
// [3,3]
// [4,2]
// [5,1]

 

🟣 while 문

주어진 조건식의 평가 결과가 참이면 코드 블록을 계속 반복 실행한다.

while은 반복 횟수가 불명확할때 사용된다.

var count = 0;

while (true) {
    console.log(count);
    count++;
    
    // count 3이면 코드 블록을 탈출한다.
    if(count === 3) break;
} // 0 1 2

조건식의 평가 결과가 언제나 참이면 무한루프에 빠지는데

이를 방지하고자 조건문으로 탈출조건을 만들고 break문으로 코드 블록을 탈출한다.

 

🟣 do... while 문

코드 블록을 먼저 실행하고 조건식을 평가한다.

그래서 코드 블록은 무조건 한번 이상 실행된다.

var count = 0;

//count가 3보다 작을 때까지 코드 블록을 계속 반복한다.
do {
    console.log(count); // 0 1 2
    count++;
}
while(count < 3);

 

 

🟣 break 문

레이블 문, 반복문 또는 switch문의 코드 블록을 탈출한다.

그 외에 break문을 사용하면 문법에러가 발생한다.

 

레이블 문은 식별자가 붙은 문으로 프로그램의 실행 순서를 제어하는데 사용한다.

switch문의 case와 default문도 레이블 문이다.

ex) case 조건식1: / default :

 

break문을 사용할때 탈출할 레이블 식별자를 지정해야 한다.

break 레이블 식별자;

 

중첩된 for문에서는 내부 for문에서 break를 실행하면 바깥까지 모두 탈출하는게 아닌

내부만 탈출해서 외부 for문으로 진입한다.

그래서 외부 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문을 탈출할때 빼고는 레이블 문은 흐름이 복잡해지고 가독성이 나빠지기 때문에

일반적으로는 권장하지 않는다.

 

🟣 continue 문

반복문의 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동시킨다.

break처럼 반복문을 탈출하지는 않는다.

var string = 'Hello World';
var search = 'l';
var count = 0;

// continue문을 사용하지 않으면 if문 내에 코드를 작성해야 한다.
for(var i=0; i<string.length; i++){
	if(string[i] === search){
    	count++;
    }
}

//continue문을 사용하면 if문 밖에 코드를 작성할 수 있다.
for(var i=0; i<string.length; i++){
	if(string[i] === search) continue;
    
    count++;
}

if문 내에서 실행해야 될 코드가 한줄이라면 coutinue문을 사용할때 보다 간편하고 가독성이 좋다.

하지만 그 반대라면 coutinue문을 사용하는게 가독성이 더 좋다.

 

 

---

🟣 삼항 연산자와 if else문의 차이점

* 할당의 차이.

1. 삼항연산자는 조건에 대한 결과 값을 바로 변수에 할당.

2. if문은 조건식 안에서 할당을 해야한다.

 

* scope의 차이.

1. 삼항연산자는 블록문을 만들수 없다. 그래서 지역변수를 생성 하지 못한다.

2. if문 중괄호로 감싸져 있기 때문에 블록문이다. 지역변수를 생성할 수 있다.

 

🟣 switch 문에서 break를 사용하지 않으면?

fall through 현상이 일어난다.

break를 사용하지 않으면 구멍 사이로 한없이 떨어지는것처럼

조건에 맞는 값만 출력하는게 아니라

default까지 switch문의 모든 값이 출력된다.

 

🟣 각각의 반복문들은 어떤 상황에서 사용하는가?

1. for문은 반복 횟수가 명확한 상황에 사용한다.

2. while문은 반복 횟수가 명확하지 않은 상황에서 특정 조건이 만족되야 하는 상황에 사용한다.

 

🟣 while, do while문의 차이점

while문은 조건을 만족하지 않으면 시작조차 하지 않지만

do while문은 조건을 나중에 비교하기 때문에 무조건 처음엔 do문을 실행한다.

 

🟣 레이블이란?

레이블은 식별자가 붙은 문으로 프로그램의 실행 순서를 제어하는데 사용한다.

레이블 문을 사용하면 이중 for문에서 내부 for문에서도 외부 for문을 컨트롤 할 수 있다.