JavaScript의 For 루프: 반복문 사용 가이드 - 좋은공간 좋은집

JavaScript에서 for 루프는 가장 기본적이고 많이 사용되는 반복문 중 하나입니다. 반복문은 코드를 여러 번 실행할 수 있는 방법을 제공하여, 동일한 작업을 여러 번 수행할 때 매우 유용합니다. 이번 글에서는 JavaScript의 for 루프의 기본 구조와 다양한 활용 예제를 통해 어떻게 사용되는지 알아보겠습니다.

JavaScript의 for 루프란?

for 루프는 특정 조건을 만족할 때까지 코드를 반복 실행하는 구조입니다. 루프를 제어하기 위한 초기값, 조건식, 증감식을 설정하여 원하는 횟수만큼 반복을 수행할 수 있습니다.

for 루프 기본 구조

for (초기값; 조건식; 증감식) {
    // 반복 실행할 코드
}

for 루프는 세 가지 주요 요소로 구성됩니다:

• 초기값: 루프가 시작될 때 한 번만 실행되는 초기 설정입니다. 주로 반복 횟수를 제어하는 변수 초기화가 이곳에서 이루어집니다.
• 조건식: 각 반복이 시작되기 전에 평가되며, 조건식이 true일 경우에만 루프가 실행됩니다. false일 경우 반복이 종료됩니다.
• 증감식: 루프가 한 번 실행될 때마다 실행되며, 주로 변수를 증가시키거나 감소시킵니다.

for 루프 예시

// 1부터 5까지 출력하는 for 루프
for (let i = 1; i <= 5; i++) {
    console.log(i);
}

위 코드에서는 i 변수가 1부터 시작하여 5까지 증가하면서 각 값을 출력합니다. i++는 반복이 실행될 때마다 i 값을 1씩 증가시킵니다. 조건식 i <= 5가 false가 되는 순간, 루프는 종료됩니다.

for 루프의 다양한 활용

for 루프는 단순한 숫자 반복 외에도 배열이나 객체와 같은 데이터 구조를 처리하는 데 유용하게 사용됩니다. 특히, 데이터를 순회하거나 누적 값을 계산하는 등의 작업에서 자주 사용됩니다.

1. 배열 순회

배열의 각 요소를 순회하면서 작업을 수행할 때, for 루프는 매우 유용합니다. 다음 예시는 배열의 모든 요소를 출력하는 방법입니다.

// 배열 요소 출력 예시
const fruits = ['사과', '바나나', '딸기', '오렌지'];

for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

이 코드에서는 배열의 길이만큼 루프가 반복되며, 배열의 각 요소를 출력합니다. fruits.length를 사용하여 배열의 길이를 구하고, 각 요소에 접근하기 위해 인덱스를 사용합니다.

2. 누적 값 계산

for 루프를 사용해 배열의 숫자 요소를 모두 더하는 누적 계산을 할 수 있습니다.

// 배열 요소 합계 계산
const numbers = [10, 20, 30, 40];
let sum = 0;

for (let i = 0; i < numbers.length; i++) {
    sum += numbers[i];
}

console.log('합계:', sum);

위 예시에서는 배열 numbers의 모든 요소를 순회하면서 sum에 누적하여 합계를 계산합니다. 최종적으로 배열의 모든 숫자가 더해져 출력됩니다.

3. 짝수와 홀수 구분

for 루프를 사용하여 주어진 범위 내의 짝수와 홀수를 구분할 수 있습니다. 아래 예시는 1부터 10까지의 숫자 중 짝수와 홀수를 출력하는 코드입니다.

// 짝수와 홀수 구분
for (let i = 1; i <= 10; i++) {
    if (i % 2 === 0) {
        console.log(i + '는 짝수입니다.');
    } else {
        console.log(i + '는 홀수입니다.');
    }
}

이 코드는 i % 2 === 0을 통해 i가 짝수인지 확인하고, 해당하는 메시지를 출력합니다. 짝수가 아닐 경우에는 홀수로 판단하여 다른 메시지를 출력합니다.

for 루프와 다른 반복문 비교

JavaScript에는 for 루프 외에도 반복문이 여러 가지 있습니다. while 루프, for...of 루프, for...in 루프 등이 있는데, 각각의 특징과 사용 방법이 다릅니다.

1. while 루프

while 루프는 주어진 조건이 참일 때만 계속해서 반복합니다. 조건이 false가 되면 반복이 종료됩니다. for 루프와 달리, 초기값과 증감식이 별도로 존재하지 않습니다.

// while 루프 예시
let i = 1;

while (i <= 5) {
    console.log(i);
    i++;
}

위 예시에서는 i가 1부터 시작하여 조건이 참일 동안 5까지 출력합니다. i++는 루프가 끝날 때마다 값을 증가시킵니다.

2. for...of 루프

for...of 루프는 배열이나 문자열과 같은 이터러블 객체를 순회할 때 사용됩니다. 배열 요소에 직접 접근할 수 있어, 인덱스를 사용할 필요가 없습니다.

// for...of 예시
const fruits = ['사과', '바나나', '딸기'];

for (const fruit of fruits) {
    console.log(fruit);
}

이 코드는 for...of를 사용해 배열 fruits의 각 요소를 순회하면서 출력합니다. 배열의 각 요소에 직접 접근할 수 있어 간결하게 작성할 수 있습니다.

3. for...in 루프

for...in 루프는 객체의 속성을 순회할 때 주로 사용됩니다. 객체의 키 값에 접근할 수 있으며, 배열의 인덱스에도 사용할 수 있습니다.

// for...in 예시
const person = { name: 'John', age: 30, city: 'New York' };

for (const key in person) {
    console.log(key + ': ' + person[key]);
}

이 예시에서는 객체 person의 각 속성 키와 값을 출력합니다. for...in은 객체의 모든 속성을 순회할 수 있어 유용합니다.

for 루프의 확장

for 루프는 매우 강력하고 유연한 반복문입니다. 간단한 숫자 반복부터 복잡한 데이터 구조 처리까지 다양한 작업을 수행할 수 있습니다. 또한, break와 continue 같은 제어문과 결합하여 반복 흐름을 제어할 수 있습니다.

1. break 문

break 문을 사용하면 반복문을 조기 종료할 수 있습니다.

// 특정 조건에서 반복 종료
for (let i = 1; i <= 10; i++) {
    if (i === 5) {
        break;  // i가 5일 때 루프 종료
    }
    console.log(i);
}

위 코드에서는 i가 5일 때 break 문을 만나 반복이 종료됩니다.

2. continue 문

continue 문을 사용하면 해당 반복을 건너뛰고 다음 반복으로 넘어갈 수 있습니다.

// 특정 조건에서 반복 건너뛰기
for (let i = 1; i <= 10; i++) {
    if (i === 5) {
        continue;  // i가 5일 때만 건너뛰기
    }
    console.log(i);
}

위 코드에서는 i가 5일 때 출력되지 않고, 나머지 값들은 모두 출력됩니다.

결론

JavaScript의 for 루프는 반복 작업을 처리하는 기본적인 도구로, 매우 다양한 용도로 사용될 수 있습니다. 배열 순회, 값 누적, 조건 처리 등 다양한 상황에서 활용할 수 있으며, break와 continue 같은 제어문과 함께 사용하면 더욱 유용하게 사용할 수 있습니다. 이번 글에서는 for 루프의 기본적인 구조와 여러 가지 활용 방법을 알아보았습니다. 이를 바탕으로 효율적인 반복문을 작성해보세요!