JavaScript | 반복문 - for문

기본

 

// 반복문
// for문 (for statement)
for (초기화부분; 조건부분; 추가동작부분){
    동작부분
}

// 연습
// 안녕하세요. 10번 출력하기
for(let i = 1; i <= 10; i++){
    console.log('안녕하세요.');
}

 

 

 

for문 작성시

1. 추가동작부분을 꼭 채울 필요는 없음
- 동작 부분 아래에 i를 증가시켜도(i++) 위와 같은 결과가 출력됨
- BUT, for문의 특성상 추가동작부분이 있기에 이 부분에서는 실제로 반복하고자하는 내용들에 집중하고, 조건과 관련된 부분은 소괄호에 집중하여 목적에 맞는 코드를 작성 가능 -> 활용하자

for (let i = 1; i <= 10;) {
    console.log(`${i} 안녕하세요.`);
    i++;
  }

 

2. 초기화부분에서 생성한 변수는 for문의 로컬변수임
- for 반복문의 초기화 부분에서 생성한 변수는 for문 안에서의 로컬변수가 됨(i)
- for 반복문이 종료되고 나서 반복문 밖에서 변수를 사용하려고 하면 오류 발생! -> 당연함, let i = 1을 for문에 작성했으니 for문 밖에서 i를 사용할 수 없음

for (let i = 1; i <= 10; i++) {
  console.log(`${i} 안녕하세요.`);
}

console.log(i); // Error !!

 

 

3. 초기화 부분도 반드시 채울 필요는 없지만, for문의 소괄호 안쪽 가장 첫번째 세미콜론은 생략할 수 없음!
- for 반복문의 로컬변수를 꼭 활용하지 않고 반복문 밖에 있는 글로벌 변수를 활용해도 아무런 문제없이 같은 결과를 출력합니다.
- for문의 소괄호 안쪽은 반드시 세미콜론 2개가 필요 -> 그렇지 않으면 실행 오류

let i = 1; 
for (; i <= 10; i++) {
  console.log(`${i} 안녕하세요`);
}

 

 

 

연습 1 - for 반복문을 사용하여 1 이상 100 이하의 짝수를 모두 출력

 

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

 

// 실행 결과
2
4
6
8
.
.
.
94
96
98
100

 

 

 

 

연습 2 - 주어진 높이(height)에 맞게 '*' 로 삼각형을 그려주는 함수 printTriangle을 완성

 

function printTriangle(height) {
    let star='';
    for(let i=0; i<height; i++){
      star +='*';
      console.log(star);
    }
}

// 테스트 코드
console.log('높이: 1');
printTriangle(1);

console.log('높이: 3');
printTriangle(3);

console.log('높이: 5');
printTriangle(5);

 

// 실행 결과

높이: 1
*
높이: 3
*
**
***
높이: 5
*
**
***
****
*****