JavaScript - for문

for문이란 코드를 원하는 만큼 반복시켜 준다.

for문에 언제부터 언제까지라고 알려주면 그만큼 반복할 수 있다.

for문의 형태는 아래와 같다.

 

for (반복조건) {
   //반복조건이 맞으면 실행할 코드
}

 

 

0부터 5까지 1씩 증가시키면서 for 문의 {} 내부를 실행하라는 뜻이다. i가 0, 1, 2, 3, 4, 5까지 총 6번의 반복문이 실행된다.

i가 5가 될 때까지 for문의 {}안을 실행하다가, 6이 되면 {} 내부로 들어가지 못하고, {} 밖으로 벗어난다. 그렇다면 i가 0, 1, 2, 3, 4, 5일 때 실행하게 되니 for문이 총 6번 실행된다.

 

결과는 똑같게 만들고 조건의 표현만 다르게 한다면 이렇게 표현할 수도 있다.

 

let count = 1;
for (let i = 0; i < 6; i++) {    
  count = count + 1;
}

 

끝 값의 조건을 i <= 5에서 i <= 6으로 변경했다. 6보다 작을때까지 실행하고 for문이 끝나기 때문에, i가 0, 1, 2, 3, 4, 5일 때만 실행하여 결국 for문을 반복하는 횟수는 똑같다.

 

for문 내부의 if문

 

const home = "대전";
let cities = ["서울", "대전", "대구", "부산", "광주", "제주도"];


for (let i = 0; i <= 5; i++) {
   if (cities[i] === home) {
     console.log("아, "+ cities[i] +" 사시는군요");
   }
}

 

i가 0일 때는 cities[0]과 home을 비교한다.

"서울" === "대전" // 같지 않으므로 if문 {} 내부로 들어가지 않고 i가 0일 때의 for문은 끝난다.

그다음에 i가 1이 증가하여 i가 1이 되면, cities[1]과 home을 비교하게 되고, "대전" === "대전" 참이므로 if문이 실행된다.

더 다양한 반복문들도 가능하다.

 

프론트엔드 코드에서는 직접 배열을 생성하지 않고 외부에서 받는 경우가 있고, 너무 배열이 길어서 도저히 길이를 셀 수 없는 경우도 있다.

이런 경우, 배열의 길이가 얼마나 되는지 알 수 있는 방법이 있다. 배열의 길이를 알면 그만큼 for문을 반복하면 된다.

배열인 변수에 length라는 속성이 있다.

 

let cities = ["서울", "대전", "대구", "대전", "광주", "대전"];
console.log(cities.length)

for (var i = 0; i < cities.length; i++) {
   if (cities[i] === home) {
     alert("아, 여기 사시는군요");
   }
}

 

cities 배열의 요소는 총 6개 이므로 6이라는 숫자가 반환된다.

배열의 길이는 6이므로 총 6번의 반복문이 실행되어야 한다. i는 0부터 5까지 총 6번이 실행되어야 하므로 배열의 길이보다 작을 때까지 반복문을 실행한다. 만약 <= 작거나 같다는 비교 연산자를 사용하면 i는 0, 1, 2, 3, 4, 5, 6까지 실행되어 총 7번의 반복문을 실행한다.