반복문

2022. 12. 30. 16:57ㆍJavascript/TCP school

반복문(iteration statements)

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

1. while 문

2. do / while 문

3. for 문

4. for / in 문

5. for / of 문

while 문

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

 

순서도

 

문법 
while (표현식) {
    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;
}

표현식이 참(true)인지를 판단하여 참이면 내부의 실행문을 실행

전부 실행하고 나면, 다시 표현식으로 돌아와 또 한 번 표현식이 참인지를 판단

루프(loop) - 이렇게 표현식의 검사를 통해 반복해서 실행되는 반복문

var i = 1;
while (i < 10) {
 // 변수 i가 10보다 작을 때만 while 문을 반복함.
  document.write(i + "<br>");
  i++; // 반복할 때마다 변수 i를 1씩 증가시켜 변수 i가 10보다 커지면 반복문을 종료함.
}

 

while 문 내부에 표현식의 결과를 변경하는 실행문이 존재하지 않을 경우 프로그램은 루프를 영원히 반복

이것을 무한 루프(infinite loop)에 빠졌다고 하며, 무한 루프에 빠진 프로그램은 영원히 종료되지 않음

무한 루프는 특별히 의도한 경우가 아니라면 반드시 피해야 하는 상황

 

따라서 while 문을 작성할 때는 표현식의 결과가 어느 순간에는 거짓(false)을 갖도록 표현식를 변경하는 실행문을 반드시 포함해야 함

 

while 문에서 실행될 실행문이 한 줄 뿐이라면 중괄호({})를 생략할 수 있음

do / while 문

먼저 루프를 한 번 실행한 후에 표현식을 검사

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

 

순서도

 

문법
do {
    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;
} while (표현식);
var i = 1, j = 1;
while (i > 3) { // 변수 i의 초깃값은 1이기 때문에 이 while 문은 한 번도 실행되지 않음.
    document.write("i : " + (i++) + "<br>");
}
do { // 변수 j의 초깃값은 1이기 때문에 이 do / while 문은 단 한 번만 실행됨.
    document.write("j : " + (j++) + "<br>");
} while (j > 3);

for 문

자체적으로 초기식, 표현식, 증감식을 모두 포함하고 있는 반복문

 

순서도

 

 

문법
for (초기식; 표현식; 증감식) {
    표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문;
}

 

초기식, 표현식, 증감식은 각각 생략될 수 있음

또한, 쉼표 연산자(,)를 사용하면 여러 개의 초기식이나 증감식을 동시에 사용할 수도 있음

 

for 문을 사용하면 앞선 예제의 while 문을 더욱 더 간결하게 표현할 수 있음

예제
for (var i = 1; i < 10; i++) {
    document.write(i + "<br>");
}

코딩연습 ▶

 

for 문에서 실행될 실행문이 한 줄 뿐이라면 중괄호({})를 생략할 수 있음

for / in 문

해당 객체의 모든 열거할 수 있는 프로퍼티(enumerable properties)를 순회할 수 있도록 해줌

 

열거할 수 있는 프로퍼티 - 내부적으로 enumerable 플래그가 true로 설정된 프로퍼티

 

루프마다 객체의 열거할 수 있는 프로퍼티의 이름을 지정된 변수에 대입

이렇게 대입받은 변수를 이용하면 루프 안에서 객체의 열거할 수 있는 프로퍼티에 순차적으로 접근할 수 있음

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

 

예제

for / in 문을 사용하여 배열의 요소에 접근

var arr = [3, 4, 5];
for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함.
    document.write(i + " ");
}
for (var i in arr) { // 위와 같은 동작을 하는 for / in 문
    document.write(i + " ");
}

 코딩연습 ▶

for / in 문을 사용하여 객체의 프로퍼티에 접근

var obj = { name : "이순신", age : 20 };
for (var i in obj) {
    document.write(i + "<br>");
}

/*
결과 값
name
age
*/

코딩연습 ▶

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

for / of 문

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

 

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

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

 

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

예제

for / of 문을 사용하여 배열의 요소에 접근

var arr = [3, 4, 5];
for (var i = 0; i < arr.length; i++) { // 배열 arr의 모든 요소의 인덱스(index)를 출력함.
    document.write(arr[i] + " ");
}
for (var value of arr) { // 위와 같은 동작을 하는 for / of 문
    document.write(value + " ");
}

 

for / of 문을 사용하여 Set 객체의 프로퍼티에 접근

var arr = new Set([1, 1, 2, 2, 3, 3]);
for (var value of arr) {
    document.write(value + " ");
}
<!DOCTYPE html>
<html lang="ko">

<head>
	<meta charset="UTF-8">
	<title>JavaScript Iteration Statement</title>
</head>

<body>

	<h1>for / of 문</h1>

	<script>
		var arr = new Set([1, 1, 2, 2, 3, 3]);

		for (var value of arr) {
			document.write(value + " ");
		}
	</script>
	
</body>

</html>
JavaScript Iteration Statement

for / of 문

for / of 문은 익스플로러에서 지원하지 않음

 

참고

http://www.tcpschool.com/javascript/js_control_loop

 

코딩교육 티씨피스쿨

4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등

tcpschool.com

 

'Javascript > TCP school' 카테고리의 다른 글

배열의 기초  (0) 2022.12.30
기타 제어문  (0) 2022.12.30
조건문  (0) 2022.12.29
기타 연산자  (0) 2022.12.28
비트 연산자  (0) 2022.12.28

관련글

티스토리툴바