🐸 [JavaScript] 제어문

JavaScript의 제어문인 조건문, 반복문에 대해 알아보자!

---

제어문 control flow statement

제어문이란, 조건에 따라 다른 code block을 실행할 때 사용하는 것이다.

흐름을 인위적으로 제어할 수 있기 때문에 코딩 스킬에 매우 중요한 문법이다!

---

블록문

block/compound statement 라고 부른다.

0개 이상의 statement를 {} 로 묶은것을 말하고, 이를 code block 이라고 한다.

JavaScript에서는 블록문을 하나의 실행단위로 취급하는데,

제어문이나 함수를 정의할 때 주로 사용된다.

---

조건문 conditional statement

JavaScript의 조건문인 if...else 문과 switch 문을 차례로 알아보자.

if...else 문

조건식의 평가 결과가 true/false 즉, boolean 값으로 평가되는 표현식이다.

이때 조건식의 평가결과가 boolean 타입이 아니라면, boolean 타입으로의 암묵적 타입 변환이 일어난다.

논리적인 참 거짓에 따라 실행할 code block을 결정하는 조건문이다.

조건식 평가 결과에 따라,
true이면 if 문의 code block,
false이면 else 문의 code block을 실행한다.

---

switch 문

단지 참과 거짓이 아닌, 여러 상황에 따라 실행할 code block을 결정하는 조건문이다.

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

이때 표현식의 평가 결과는 주로 boolean 타입이 아닌, 문자열과 숫자값이다.

case 문

상황을 의미하는 표현식을 지정하고, 그 뒤에 실행문을 위치시킨다.

만약 switch문의 표현식과 일치하는 case문이 없으면, default 문으로 이동하거나 종료한다.

지금까지 우리가 아는대로 switch 문을 구성해보았다.

case도 잘 나눠두었고, 실행문도 각자 잘 위치시켜뒀지만, 이 코드는 생각과는 다르게 동작한다.

fall through

일치하는 case문을 발견했으면, 해당 실행문을 실행한 뒤, default문으로 이동하거나 종료한다고 했다.

그러나 위의 코드에서는, case 11의 실행문을 실행하고도 case 12까지 모두 실행한 뒤에 종료된다.

이런 문제를 fall through라고 부르며, 이는 break로 해결 가능하다.

(default문을 적지 않은 코드이며, 이는 선택사항이다.)

각 case의 실행문 끝에 break를 붙여준다.

이제 예상대로 작동한다!

default문에는 break를 붙이지 않아도 좋다.

생각을 해보면, default를 실행한 뒤에는 어차피 switch문이 종료되기 때문에, 굳이 적지 않아도 문제없지 코드가 잘 실행되고 종료되는 것을 알 수 있다.

if...else, switch 둘 중 어느 것을 사용해도 상관이 없는 상황에는, 되도록이면 if...else 문을 사용하도록 하자.

---

반복문 loop statement

반복문이란, 조건식의 평가 결과가 참인 경우에만 code block을 실행하는 제어문을 말한다.

실행문을 한번 실행한 다음, 다시 조건식을 평가해 해당 결과가 거짓일 때까지 실행을 반복한다.

JavaScript의 반복문으로는 for, while, do...while 문이 있다.

차례로 살펴보자.

for문

C언어에서의 for문과 다를 바 없는 형태이지만,

JavaScript의 프로그래밍에서 for문은 매우 중요하다!

그러니 코드만 한 번 보고 넘어가자.

---

while문

반복 횟수가 불명확한 경우에 주로 사용하는 반복문이다.

무한 loop으로 만들어두고, 탈출 조건을 if문으로 만들어 break를 사용해 탈출하도록 한다.

---

do...while문

while문의 다른 버전이라고 봐도 무방하다.

다만 조건문의 위치가 다르다.

while 문의 경우, 조건문을 검사하고, 참인 경우에만 문 내로 진입했다.

하지만 do...while문의 경우, 조건문이 실행문 뒤에 위치하기 때문에, 참이든 거짓이든
code block을 실행시킨다.

그런 다음 조건을 검사하고, 그 때부터 참인 동안은 반복, 거짓이면 종료한다.

---

break 문

code block에서 탈출할 때 사용하는 제어문이다.

label문, 반복문, 그리고 switch 문에서 사용하고, 이 외의 경우에 사용하면 SyntaxError가 발생한다.

---

continue문

반복문의 code block 실행이 continue를 만나면, 해당 지점에서 중단된다.

그 이후 반복문의 증감식으로 실행 흐름을 이동시킨다.

---

여담..

사실 이렇게 흐름을 인위적으로 제어하다 보면, 코드의 가독성이 떨어지고 오류가 발생할 가능성이 높아진다.

JavaScript에서는 forEach, map, filter, reduce 같은 고차 함수를 제공하는데,

이들을 사용하면 제어문을 억제해 복잡성을 해결할 수 있다고 한다.

제어문은 해당 시점에서 같이 공부 중인 C언어의 문법과 다른 것이 없어서, 어려운 것도 새로운 것도 없이 그냥 무난하게 정리된 것 같다.

다음 글에서는 타입 변환과 단축 평가에 대해 정리를 하게 될 것 같은데,

해당 내용에 대해서는 아는 게 거의 없어서 걱정되기도 하고 기대된다!