카테고리 없음

JavaScript 제어문: 5가지 반복문 사용법

ftsbts 2025. 4. 11. 15:00
반응형
JavaScript 제어문: 반복문 사용법

JavaScript에서 제어문은 프로그램의 흐름을 제어하는 중요한 요소입니다. 이 글에서는 반복문을 중심으로, while문, for문, break, continue의 사용법을 자세히 살펴보겠습니다. 반복문은 특정 조건이 만족될 때까지 코드 블록을 반복적으로 실행할 수 있게 해줍니다. 반복문을 통해 코드의 중복을 줄이고, 효율적인 프로그램을 만들 수 있습니다.

1. While문

While문은 조건이 true인 동안 실행되는 반복문입니다. 기본적인 구조는 다음과 같습니다:

while (조건) {
        // 실행할 코드
    }

예를 들어, 1부터 5까지의 숫자를 출력하는 방법은 다음과 같습니다:

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

2. For문

For문은 반복 횟수를 미리 알고 있을 때 유용하게 사용됩니다. 기본 구조는 다음과 같습니다:

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

1부터 5까지의 숫자를 출력하는 방법은 다음과 같습니다:

for (let i = 1; i <= 5; i++) {
    console.log(i);
}

3. Break와 Continue

Break 문은 반복문을 즉시 종료시키고, Continue 문은 현재 반복을 건너뛰고 다음 반복으로 넘어가게 합니다. 이 두 문은 반복문을 제어하는 매우 유용한 도구입니다.

Break 사용 예시

아래 코드는 숫자 1부터 10까지 출력하되, 5에 도달하면 반복을 종료합니다:

for (let i = 1; i <= 10; i++) {
    if (i === 5) {
        break;
    }
    console.log(i);
}

Continue 사용 예시

아래 코드는 1부터 10까지의 숫자 중 홀수만 출력합니다. 짝수는 건너뛰게 됩니다:

for (let i = 1; i <= 10; i++) {
    if (i % 2 === 0) {
        continue;
    }
    console.log(i);
}

사례 1: 배열 요소 출력하기

JavaScript에서 배열의 요소를 반복문을 사용하여 출력하는 것은 매우 일반적인 작업입니다. 다음은 배열의 모든 요소를 출력하는 예시입니다.

코드 설명 
const fruits = ['사과', '바나나', '체리', '포도'];
for (let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}
 주어진 배열의 요소를 반복적으로 출력합니다.

이 코드는 for문을 사용하여 배열의 길이만큼 반복하며 각 요소를 출력합니다. 배열의 길이는 fruits.length를 통해 알 수 있습니다.

사례 2: 사용자 입력 처리하기

사용자로부터 입력을 받아 특정 조건에 따라 반복문을 사용하는 예시입니다. 아래 코드는 사용자가 'exit'를 입력할 때까지 문자열을 입력받아 출력합니다.

코드 설명 
let input;
while (input !== 'exit') {
    input = prompt('문자를 입력하세요 (종료하려면 exit 입력):');
    console.log(input);
}
 사용자가 'exit'를 입력할 때까지 반복적으로 입력받습니다.

이 코드에서는 while문을 사용하여 사용자의 입력을 계속 받아오며, 'exit'를 입력하면 반복이 종료됩니다. 이는 사용자와의 상호작용을 가능하게 합니다.

사례 3: 중첩 반복문 사용하기

중첩 반복문은 반복문 내에 또 다른 반복문을 사용하는 것입니다. 다음은 2차원 배열을 출력하는 예시입니다.

코드 설명 
const matrix = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];
for (let i = 0; i < matrix.length; i++) {
    for (let j = 0; j < matrix[i].length; j++) {
        console.log(matrix[i][j]);
    }
}
 2차원 배열의 모든 요소를 출력합니다.

이 코드는 외부 반복문이 행을, 내부 반복문이 열을 반복하여 모든 요소를 출력합니다. 중첩 반복문은 배열의 구조를 다룰 때 유용합니다.

실용적인 팁

팁 1: 반복문 최적화

반복문을 사용할 때는 가능한 최적화하여 성능을 높이는 것이 중요합니다. 반복문이 실행되는 횟수를 줄이기 위해서는 조건문을 미리 계산하고, 불필요한 연산을 피하도록 합니다. 예를 들어, for (let i = 0; i < arr.length; i++)에서 arr.length를 반복적으로 호출하는 것보다 let len = arr.length;로 미리 저장하는 것이 더 효율적입니다.

팁 2: 배열 메서드 활용하기

JavaScript에서는 forEach, map, filter와 같은 배열 메서드를 사용하여 반복문을 대체할 수 있습니다. 이러한 메서드는 코드의 가독성을 높이고, 더 간결한 형태로 데이터를 처리할 수 있게 해 줍니다. 예를 들어, arr.forEach(item => console.log(item));와 같이 사용할 수 있습니다.

팁 3: 중단 조건 명확히 설정하기

반복문을 사용할 때는 중단 조건을 명확히 설정하는 것이 중요합니다. 무한 루프에 빠지지 않도록 조건을 항상 확인하고, 필요할 경우 break 문을 사용하여 안전하게 종료할 수 있도록 합니다. 이를 통해 예기치 않은 오류를 방지할 수 있습니다.

팁 4: 변수 스코프 관리하기

반복문 내에서 선언된 변수의 스코프를 잘 관리해야 합니다. let을 사용하여 변수를 선언하면 블록 스코프를 가지므로, 반복문 내에서의 변수가 외부에 영향을 주지 않도록 할 수 있습니다. 이를 통해 코드의 예측 가능성을 높이고, 유지보수성을 향상시킬 수 있습니다.

팁 5: 디버깅 활용하기

반복문이 예상대로 작동하지 않을 때는 console.log를 활용하여 중간 결과를 출력하고 디버깅하는 것이 좋습니다. 반복문 내부에 변수를 출력하여 로직이 올바르게 작동하는지 확인하고, 문제를 쉽게 파악할 수 있도록 합니다. 이는 특히 복잡한 로직을 다룰 때 유용합니다.

요약 및 실천 팁


JavaScript의 반복문은 코드를 효율적으로 작성하는 데 필수적인 요소입니다. while문, for문, break, continue를 적절히 활용하여 원하는 결과를 얻을 수 있습니다. 반복문을 사용하면서 성능 최적화와 가독성을 고려하는 것이 중요합니다. 다음은 실천할 수 있는 팁입니다:

  • 반복문을 사용할 때는 필요에 따라 최적화하여 속도를 높이세요.
  • 배열 메서드를 활용하여 코드의 가독성을 높이세요.
  • 중단 조건을 명확히 설정하여 무한 루프를 피하세요.
  • 변수 스코프를 관리하여 코드의 예측 가능성을 높이세요.
  • 디버깅을 통해 코드의 작동을 확인하세요.

이러한 팁과 사례를 바탕으로, JavaScript에서 반복문을 효과적으로 활용해 보세요!

반응형