반복문
AI
qwen-3-235b-a22b
반복문
개요
반복문이란?
반복문(Loop)은 프로그래밍에서 특정 코드 블록을 조건이 만족할 때까지 반복 실행하는 제어 구조입니다. JavaScript에서는 다양한 반복문 구문을 제공하여 배열, 객체, 이터러블(iterable) 등의 데이터를 효율적으로 처리할 수 있도록 지원합니다.
JavaScript에서의 역할
JavaScript의 반복문은 다음과 같은 상황에서 핵심적인 역할을 합니다: - 배열/객체의 요소 순회 - 비동기 작업의 반복 처리 (타이머, 네트워크 요청 등) - 알고리즘 구현 (탐색, 정렬 등) - 사용자 입력 검증 등 반복적인 작업 자동화
반복문의 종류
for 반복문
가장 일반적인 반복문 구조로, 초기화 - 조건 검사 - 증감의 3단계를 포함합니다.
문법
for (초기화; 조건; 증감) {
// 반복 실행할 코드
}
예시
for (let i = 0; i < 5; i++) {
console.log(`반복 횟수: ${i}`);
}
주의사항
var대신let사용 시 블록 스코프로 안전하게 변수 관리 가능- 무한 루프 방지를 위해 증감식 누락 주의
while 반복문
조건이 참일 동안 코드 블록을 반복 실행합니다.
문법
while (조건) {
// 반복 실행할 코드
}
예시
let count = 0;
while (count < 3) {
console.log(`카운트: ${count}`);
count++;
}
특징
- 반복 횟수가 명확하지 않은 경우 유용
- 초기화 및 증감식을 별도로 관리해야 함
do...while 반복문
최소 1회는 코드를 실행한 후 조건 검사
문법
do {
// 실행 코드
} while (조건);
예시
let userInput;
do {
userInput = prompt("숫자를 입력하세요");
} while (isNaN(userInput));
활용 시나리오
- 사용자 입력 검증
- 조건 검사 전 반드시 1회 실행이 필요한 경우
for...in 반복문
객체의 열거 가능한 속성을 순회할 때 사용
문법
for (변수 in 객체) {
// 실행 코드
}
예시
const person = { name: "Alice", age: 25 };
for (let prop in person) {
console.log(`${prop}: ${person[prop]}`);
}
주의사항
- 배열 인덱스 순회 시 문자열 타입으로 반환
- 상속된 속성까지 포함될 수 있으므로
hasOwnProperty()검사 필요
for...of 반복문
ES6부터 도입된 이터러블(배열, 문자열, Map 등) 전용 반복문
문법
for (변수 of 이터러블) {
// 실행 코드
}
예시
const fruits = ["사과", "바나나", "체리"];
for (const fruit of fruits) {
console.log(fruit);
}
지원 객체
| 데이터 타입 | 이터러블 여부 |
|---|---|
| Array | ✅ |
| String | ✅ |
| Map | ✅ |
| Set | ✅ |
| DOM 컬렉션 | ✅ |
| 일반 객체 | ❌ |
반복 제어문
break 문
현재 반복문을 즉시 종료합니다.
예시
for (let i = 0; i < 10; i++) {
if (i === 5) break;
console.log(i); // 0~4만 출력
}
continue 문
현재 반복을 건너뛰고 다음 반복으로 진행합니다.
예시
for (let i = 0; i < 5; i++) {
if (i % 2 === 0) continue;
console.log(i); // 홀수(,3)만 출력
}
라벨付き 반복문
중첩 반복문에서 특정 레벨의 반복문을 제어할 수 있습니다.
outerLoop: for (let i = 0; i < 3; i++) {
for (let j = 0; j < 3; j++) {
if (i + j === 3) break outerLoop;
console.log(`i=${i}, j=${j}`);
}
}
활용 사례 및 주의사항
일반적인 사용법
-
배열 처리
const numbers = [10, 20, 30]; for (const num of numbers) { console.log(num * 2); } -
객체 속성 검색
const user = { id: 1, role: "admin" }; for (const key in user) { if (key === "role") { console.log(`관리자 권한 확인: ${user[key]}`); break; } }
피해야 할 실수
- ❌
for...in으로 배열 인덱스를 숫자 타입으로 기대하는 경우 - ❌ 무한 루프 발생 조건 (
while(true)등) - ❌ 이터러블이 아닌 객체에
for...of사용 시도
성능 고려
- 배열 순회:
for...of가for루프보다 약 20% 느린 경우도 있음 (성능 민감한 코드에서 주의) - DOM 조작:
for...of대신querySelectorAll()과 결합한for루프 권장 - 최적화 팁: 반복 횟수가 고정된 경우
for루프가 가장 효율적
관련 문서
AI 생성 콘텐츠 안내
이 문서는 AI 모델(qwen-3-235b-a22b)에 의해 생성된 콘텐츠입니다.
주의사항: AI가 생성한 내용은 부정확하거나 편향된 정보를 포함할 수 있습니다. 중요한 결정을 내리기 전에 반드시 신뢰할 수 있는 출처를 통해 정보를 확인하시기 바랍니다.