본문 바로가기
[JavaScript]

[JavaScript] 제어문 (if, switch, for, while, do~while)

by 북방바다코끼리표범 2023. 8. 19.

복습

https://shins99.tistory.com/49

 

[JavaScript] 연산자

복습 https://shins99.tistory.com/47 [JavaScript] 변수와 자료형 복습 https://shins99.tistory.com/47 [JavaScript] 자바스크립트(JavaScript)란? 자바스크립트(JavaScript) - 사용자의 상호작용에 따라 웹 페이지를 동적제어

shins99.tistory.com


제어문(control flow statements)

- 프로그램의 순차적인 흐름을 제어해야 할 때 사용하는 실행문 (조건문, 반복문 등이 포함)

 

조건문(conditional statements)

- 프로그램 내에서 주어진 표현식의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문

- 조건문 중에서 가장 기본이 되는 실행문은 if 문

- 자바스크립트에서 사용할 수 있는 조건문의 형태

1. if 문
2. if / else 문
3. if / else if / else 문
4. switch 문

 

조건문 if

- if 문은 표현식의 결과가 참(true)이면 주어진 실행문을 실행, 거짓(false)이면 아무것도 실행하지 않음

1
2
3
if (조건식) {
  //  조건식의 결과가 참일 때 실행하고자 하는 실행문;
}
cs

else 

- if 문과 같이 사용할 수 있는 else 문은 if 문의 표현식 결과가 거짓(false)일 때 주어진 실행문을 실행

1
2
3
4
5
if (조건식) {
   // 조건식의 결과가 참일 때 실행하고자 하는 실행문;
else {
   // 조건식의 결과가 거짓일 때 실행하고자 하는 실행문;
}
cs

 

else if

- else if 문은 if 문처럼 표현식을 설정할 수 있으므로, 중첩된 if 문을 좀 더 간결하게 표현 가능

- 하나의 조건문 안에서 if 문과 else 문은 단 한 번만 사용 가능

- else if 문은 여러 번 사용되어 다양한 조건을 설정할 수 있음

1
2
3
4
5
6
7
if (조건식 1) {
  // 조건식 1이 참이면 이 코드 블록이 실행
else if (조건식 2) {
  //조건식 2가 참이면 이 코드 블록이 실행
else {
  //조건식 1과 조건식 2가 모두 거짓이면 이 코드 블록이 실행
}
cs

삼항 연산자에 의한 조건문

문법
표현식 ? 반환값1 : 반환값2

선택문 switch

- if / else 문과 마찬가지로 주어진 조건 값에 따라 프로그램이 다른 명령을 수행하도록 하는 조건문

- if / else 문보다 가독성 측면에서 더 좋음

1
2
3
4
5
6
7
8
9
10
11
switch (표현식) {
  case 표현식1:
    // switch문의 표현식과 표현식1이 일치하면 실행될 문;
    break;
  case 표현식2:
    // switch문의 표현식과 표현식2가 일치하면 실행될 문;
    break;
  default:
    // switch문의 표현식과 일치하는 case문이 없을 때 실행될 문;
    break;
}
cs

 

반복문(iteration statements)

- 프로그램 내에서 똑같은 명령을 일정 횟수만큼 반복하여 수행하도록 제어하는 실행문

- 프로그램이 처리하는 대부분의 코드는 반복적인 형태가 많으므로, 가장 많이 사용되는 실행문 중 하나

- 자바스크립트에서 사용할 수 있는 반복문의 형태

 

1. for 문

2. for / in 문

3. for / of 문

4. while 문

5. do / while 문

 

 

반복문 for

- for 문은 while 문과는 달리 자체적으로 초기식, 표현식, 증감식을 모두 포함하고 있는 반복문

- 따라서 while 문보다는 좀 더 간결하게 반복문을 표현 가능

1
2
3
4
5
6
for (변수 선언문 또는 할당문; 조건식; 증감식) {
  조건식이 참인 경우 반복 실행될 문;
}
for (let i=0; i < 2; i++) {
  console.log(i)
}
cs

 

반복문 for / in

- for / in 문은 일반적인 for 문과는 전혀 다른 형태의 반복문

- for / in 문은 해당 객체의 모든 열거할 수 있는 프로퍼티(enumerable properties)를 순회하게 함

- 참고 : for / in 문은 해당 객체가 가진 모든 프로퍼티를 반환하는 것이 아닌, 오직 열거할 수 있는 프로퍼티만을 반환

1
2
3
for (변수 of 객체) {    
    객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문;
}

반복문 for / of

- for / of 문은 반복할 수 있는 객체(iterable objects)를 순회할 수 있도록 해주는 반복문

- 자바스크립트에서 반복할 수 있는 객체에는 Array, Map, Set, arguments 객체 등

- 이 반복문은 루프마다 객체의 열거할 수 있는 프로퍼티의 값을 지정된 변수에 대입

- 참고 : for / of 문은 익스플로러에서 지원X

1
2
3
for (변수 of 객체) {    
    객체의 모든 열거할 수 있는 프로퍼티의 개수만큼 반복적으로 실행하고자 하는 실행문;
}
cs

 

반복문 while

- while 문은 특정 조건을 만족할 때까지 계속해서 주어진 실행문을 반복 실행

1
2
3
4
문법
while (표현식) {
    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;
}
cs
1
2
3
4
5
6
7
// 예제
let count = 0;
 
while (count < 3) {
  console.log(count);
  count++
}
cs

반복문 do while

- while 문은 루프에 진입하기 전에 먼저 표현식부터 검사

- do / while 문은 먼저 루프를 한 번 실행한 후에 표현식을 검사

- do / while 문은 표현식의 결과와 상관없이 무조건 한 번은 루프를 실행

1
2
3
4
문법
do {
    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;
while (표현식);
cs
1
2
3
4
5
6
7
// 예제
let count = 0;
 
do {
  console.log(count);
  count++
while (count < 3);
cs

break 문

- 루프 내에서 사용하여 해당 반복문을 완전히 종료시키고, 반복문 바로 다음에 위치한 실행문으로 프로그램의 흐름을 이       동시킴

- 루프 내에서 표현식의 판단 결과에 상관없이 반복문을 완전히 빠져나가고 싶을 때 사용

1
2
3
문법
1. break;
2. break 라벨이름;
cs

continue 문

- 루프 내에서 사용하여 해당 루프의 나머지 부분을 건너뛰고, 바로 다음 표현식의 판단으로 넘어가게 함.

- 보통 반복문 내에서 특정 조건에 대한 처리를 제외하고자 할 때 자주 사용.

1
2
3
문법
1. continue;
2. continue 라벨이름;
cs
1
2
3
4
5
6
7
8
9
10
11
12
예제)
let string = 'consomme popcorn'
let search = 'm'
let count = 0;
 
for (let i = 0; i < string.length; i++) {
  // 'o'가 아니면 현 지점에서 실행을 중단하고 반복문의 증감식(i++)으로 이동
  if (string[i] !== search) continue;
  count++ // continue 문이 실행되면 이 문은 실행되지 않음
}
 
console.log(count); // 4
cs

label 문

- 프로그램 내의 특정 영역을 식별할 수 있도록 해주는 식별자
- continue 문과 break 문의 동작이 프로그램의 흐름을 특정 영역으로 이동시킬 수 있음

1
2
문법
label: 식별하고자 하는 특정 영역
cs

'[JavaScript]' 카테고리의 다른 글

[JavaScript] 객체 (Object)  (19) 2023.08.22
[JavaScript] 배열 (Arrays)  (18) 2023.08.21
[JavaScript] 연산자  (13) 2023.08.18
[JavaScript] 변수와 자료형  (13) 2023.08.17
[JavaScript] 자바스크립트(JavaScript)란?  (12) 2023.08.16