[JavaScript] 모던 JS Deep Dive 8장

ubin·2023년 10월 8일

JavaScript

목록 보기
10/21
post-thumbnail

8.0 제어문

조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용하며, 일반적으로 코드는 순차적으로 실행된다.

  • 제어문을 통해 코드의 실행 흐름을 인위적으로 제어할 수 있음
  • 코드 흐름을 이해하기 어렵게 만들기 때문에 가독성을 해침

8.1 블록문

0개 이상의 문을 {중괄호}로 묶은 것으로, 코드 블록 또는 블록이라고 부른다.

  • 블록문은 하나의 실행 단위로 단독 사용 가능
  • 일반적으론 제어문 또는 함수 정의시 사용
  • 문의 종료를 의미하는 자체 종결성을 가지므로 세미콜론 안붙여도됨

8.2 조건문 conditional statement

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

  • boolean 값으로 평가될 수 있는 표현식

if … else 문

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

  • 조건식은 boolean 값으로 평가되어야 함
  • 조건식이 boolean 값이 아닌 값으로 평가되면 JS 엔진에 의해 암묵적 boolean 값으로 강제 변환됨
  • 조건식을 추가하여 실행된 코드 블록을 늘리려면 else if 문 사용
  • else if 문과 else 문은 옵션
  • 코드 블록 내의 문이 하나면 중괄호 생략 가능
  • 삼항 조건 연산자로 바꿔 쓸 수 있음 (변수에 할당 가능)
var num = 2;

if (num > 0) {
	console.log('양수');
}
else if (num < 0) {
	console.log('음수');
else {
	console.log('영');
}

//삼항 연산자로 표현
var kind = num ? (num > 0 ? '양수' : '음수') : '영'; 
console.log(kind);

switch 문

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

  • case 문은 상황을 의미하는 표현식을 지정하고 콜론:으로 마침
  • switch 문의 표현식과 일치하는 case 문이 없을 시 default 문으로 이동
  • default 문은 옵션이고, 맨 마지막에 break 안써도 됨 (어차피 빠져나갈 것이기 때문)
  • 다양한 상황(case)에 따라 실행할 코드 블록을 결정할 때 사용
  • 폴 스루 (fall through) 방지를 위해 case 문에 자미가에 break 문 넣기
  • 여러 개의 case 문을 하나의 조건으로도 사용할 수 있음
  • 보통은 if …else 문 사용 추천
  • 조건이 투머치일 때 switch 문이 더 가독성 좋으면 switch 문 사용 추천
switch(표현식) {
	case 표현식1:
		switch 문의 표현식과 표현식1이 일치하면 실행될 문;
		break;
	case 표현식2:
		switch 문의 표현식과 표현식2이 일치하면 실행될 문;
		break;
	default:
		switch 문의 표현식과 일치하는 case 문이 없을 때 실행될 문;
}

8.3 반복문

조건식의 평가 결과가 참인 경우 코드 블록을 실행하며, 조건식이 거짓일 때까지 반복한다.

for 문

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

  • 변수 선언문, 조건식, 증감식은 모두 옵션
  • for ()에 어떤 식도 선언하지 않으면 무한루프
  • 반복 횟수가 명확할 때 주로 사용
//일반적인 형태 
for (변수 선언문 또는 할당문; 조건식; 증감식) { //var i = 0; i < 2; i++
	조건식이 참인 경우 반복 실행될 문;
}

//무한루프
for (;;) {
	...
}

//중첩 for 문
for (var i = 0; i < 3; i++) {
	for (var j = 0; j < 5; j++) {
		...
	}
}

while 문

주어진 조건식의 평가 결과가 참이면 코드 블록을 반복해서 실행

  • 반복 횟수가 불명확할 때 주로 사용
  • 조건문의 평가 결과가 거짓이 되면 코드 블록을 실행하지 않고 종료
  • 조건식의 평가 결과가 boolean 값이 아니면 boolean 값으로 강제 변환하여 구별
  • 평가 결과가 언제나 참이면 무한루프
  • 무한루프 탈출 방법은 while 문 내에 if 문으로 탈출 조건 만들고 break 문으로 탈출
var count = 0;

//일반적인 형태 
while (count < 3) {
	..
	count++;
}

//무한루프
while (true) {
	...
	break; //탈출조건 
}

do … while 문

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

  • 코드 블록은 무조건 한 번 이상 실행됨
do {
	...
	count++;
} while (count < 3);

8.4 break 문

레이블문, 반복문, 또는 switch 문을 탈출하는 문

  • 위 문들의 코드 블록 외에 break 문 사용시 SyntexError 발생
  • 레이블문 탈출시 사용
  • 반복문을 더 이상 진행하지 않아도 될 때 사용

label 문

레이블 문은 식별자(이름:)가 붙은 문

  • 레이블 문은 실행 순서를 제어하는데 사용됨
  • 탈출시 break 문에 레이블 식별자 지정
  • case 문 default 문 ..등
  • 중첩 for 문의 내부 for 문에서 break 문을 실행하면 외부 for 문으로 진입
  • 외부 for 문 탈출시 레이블 문 사용해야 함
  • 실행 흐름 복잡해지면서 가독성 나쁨 및 오류 발생 확률 증가
  • 일반적으로 사용 비추천

8.5 continue 문

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

  • break 문처럼 반복문을 탈출하지는 않음
  • 문자열은 유사 배열이므로 for 문으로 순회할 수 있음 !
  • if 문 내에서 실행해야 할 코드가 길다면 continue 문을 사용하는 것이 가독성 좋음
  • continue 문을 사용하면 if 문 밖에 코드 작성 가능
for (var i = 0; i < string.length; i++) {
	if (string[i] !== search) coninue;
	count++; //coninue 문이 실행되면 이 문은 실행되지 않음
profile
프론트엔드 개발자가 되고싶은 코린이⌨️

0개의 댓글