[JavaScript] 반복문 활용

JavaScript도 하나의 프로그래밍 언어인 만큼, 반복문을 사용할 수 있습니다.

파이썬과 똑같은 점은 javascript 반복문에서도 while과 for를 사용한다는 건데요, 형식은 조금 다릅니다.

 

이번 포스트에서는 JavaScript에서 반복문을 사용하는 방법을 살펴보겠습니다!

---

while

while문은 조건문이 참일 때 문장을 계속해서 수행하는 반복문입니다.

let i = 0

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

// 0부터 4까지 출력됨

---

for

JavaScript에서 for문은 3가지 형태가 있습니다.

1. 기본 형태
2. for ... in 형태
3. for ... of 형태

---

기본 형태

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

// 0부터 4까지 출력됨

---

for ... in 형태

for ... in 형태는 객체의 열거 가능한 속성(property)에 대해 반복합니다.

인덱스의 순서가 중요한 배열에서는 사용하지 않아요!!
(dictionary 같은 순서가 중요하지 않은 객체에 대해서만 사용)

const fruits = {a: 'apple', b: 'banana'}

for (const key in fruits) {
	console.log(key)          // a, b
    console.log(fruits[key])  // apple, banana
}

---

for ... of 형태

for ... of 형태는 반복 가능한 객체(배열, 문자열 등)에 대해 반복합니다.

const number = [0, 1, 2, 3]

for (const number of numbers) {
	console.log(number)  // 0, 1, 2, 3
}

---

for ... in 과 for ... of 의 차이

// for...in 과 for...of 의 차이
const arr = ['a', 'b', 'c']

for (const i in arr) {
  console.log(i)  // 0, 1, 2
}

for (const i of arr) {
  console.log(i)  // a, b, c
}

 

=> for ... in 의 경우, 객체의 인덱스나 key를 뽑아옵니다.

=> for ... of 의 경우, 객체의 값을 뽑아옵니다.

---

반복문 사용 시 const 사용 여부

• for문 기본 형태
  • for (let i = 0; i < 5; i++) { ... } 의 경우, i를 "재할당"하면서 사용하기 때문에 const를 사용하면 에러가 발생합니다.
• for ... in, for ... of
  • 재할당이 아닌, "매 반복마다 다른 속성이 변수에 저장"되는 것이므로 const를 사용해도 에러가 나지 않습니다.