for (let i = 0; i < 10; i++){
console.log(i)
}
위 코드를 실행 시키면 0,1,2,3,4,5,6,7,8,9 가 출력된다.
0부터 9번 1씩 추가했기 때문이다.
for (let i = 1; i < 11; i++){
console.log(i)
}
위 코드를 실행시키면 1,2,3,4,5,6,7,8,9,10 이 출력된다.
1부터 9번 1씩 추가했기 때문이다.
for (let i = 0; i < 11; i++){
console.log(i + 1)
}
위 코드를 실행시키면 1,2,3,4,5,6,7,8,9,10,11 이 출력된다. 11보다 작게 라고 조건을 적었는데 왜 11까지 나왔을까?
콘솔에 i + 1 로 출력하라고 했기 때문이다. 반복문이 원래 출력해야하는 값은 0,1,2,3,4,5,6,7,8,9,10 인데 각 값에 1씩 더해서 출력된 것이다.
반복문과 배열은 자주 사용되는 조합이다.
let myArray =[]
//반복적으로 100부터 110까지 myArray.push()
for (let i =100; i<=110; i++){
myArray.push(i)
}
console.log(myArray)
//[100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110]
위의 for loop을 순회할 때의 상황은 다음과 같다.
Array를 순회한다는 것은 배열에 요소 하나하나를 접근해서 동일한 동작을 실행하는 것이다. 따라서 Array의 요소를 순회하며 콘솔에 출력한다는 것은 요소 하나하나를 콘솔로 출력한다는 뜻이다.
let colors = ['red','blue','orange','black']
console.log(colors[0])
console.log(colors[1])
console.log(colors[2])
console.log(colors[3])
/*"red"
"blue"
"orange"
"black"*/
for (let i=0; i < 4; i++){
console.log(colors[i])
}
/*
"red"
"blue"
"orange"
"black"*/
위의 방식과 밑에 방식 모두 같은 결과물을 출력한다.
위의 방식은 계속해서 콘솔로 colors 배열의 index를 찍어줘야한다.
반면 for문을 사용하면 index를 1씩 증가시키면서 array를 순회하도록 할 수 있다.
let myNumbers = [10, 20, 30, 40, 50]
for (let i = 0; i < 5; i++){
console.log(myNumbers[i] + 1)
}
/*
11
21
31
41
51
*/
+1을 어디에 해야하는지가 관건이다.
myNumbers[i+1] 이라고 하면 안된다.
이렇게 하면 요소에 1이 더해지는게 아니라 인덱스에 1이 추가되는것이기 때문에 인덱스가 변경되는거지 요소에 1이 더해지지 않는다.
위의 예제처럼 조건에 직접 숫자를 적어서 몇 이하 까지 순회하라고 할 수 있지만 이런 경우 배열의 길이가 바뀔때마다 조건을 수정해야한다.
이런 번거로움을 덜기 위해 조건에 배열의 길이를 활용해보자.
let myNumbers = [10, 20, 30, 40, 50, 60, 70, 80, 90, 100]
for (let i = 0; i < myNumbers.length; i++){
console.log(myNumbers[i] + 1)
}
/*
10
20
30
40
50
60
70
80
90
100
*/
i < myNumbers.length 조건을 적을 때 배열의 길이와 작거나 같으면 안되고 작아야 한다. 배열의 길이는 항상 배열의 인덱스보다 1이 크기 때문이다. (요소가 10개 있는 배열의 길이는 10이지만 인덱스는 [0]부터 시작하기 때문에 [9]까지 있다.)