반복문 ② 반복문

JavaScript에서 사용할 수 있는 반복문에는 for in 반복문, for of 반복문, for 반복문, while 반복문이 있다.

 

for in 반복문

for (const 반복 변수 in 배열 또는 객체) {
  문장
}

 

for in 반복문은 배열의 인덱스를 기반으로 반복할 때 사용하고, 배열의 인덱스를 반복 변수로 사용한다.

<script>
  const numbers = [10, 20, 30]
  
  for (const i in numbers) {
    console.log(`${i}번째 요소: ${numbers[i]}`)
  }
</script>

0번째 요소: 10
1번째 요소: 20
2번째 요소: 30

 

for of 반복문

 

for in 반복문은 배열의 인덱스를 반복 변수로 사용하기 때문에 반복문 내부에서 요소에 접근하려면 배열[인덱스]의 형태를 사용해야 하고,

 

for in 반복문을 안정적으로 사용하기 위해선 위 기본형에 몇 가지 코드를 추가해야 한다.

 

for in 반복문의 이러한 약점을 해결하기 위해 등장한 것이 for of 반복문이다.

for (const 반복 변수 of 배열 또는 객체) {
  문장
}

for of 반복문은 배열의 값을 기반으로 반복할 때 사용하고, 요소의 값을 반복 변수로 사용한다.

<script>
  const numbers = [10, 20, 30]
  
  for (const number of numbers) {
    console.log(`${number}`)
  }
</script>

10
20
30

<script>
  const array = [10, 20, 30]

  for (const i in array) {
    console.log(i)
  }

  for (const i of array) {
    console.log(i)
  }
</script>

0
1
2
10
20
30

 

for 반복문

for (let i = 0; i < 반복 횟수; i++) {
  문장
}

 

for 반복문은 횟수를 기반으로 반복할 때 사용하고, 반복 횟수를 반복 변수로 사용한다.

 

for 반복문은 다른 반복문과 달리 반복 변수를 let 키워드로 선언한다.

 

for 반복문은 다양한 응용이 가능한 범용적인 반복문이다.

<script>
  const numbers = [10, 20, 30]
  
  for (let i = 0; i < numbers.length; i++) {
  	console.log(`${i}번째 요소: ${numbers[i]}`)
  }
</script>

0번째 요소: 10
1번째 요소: 20
2번째 요소: 30

 

while 반복문

while (불 값을 리턴하는 표현식) {
  문장
}

 

while 반복문은 조건을 기반으로 반복할 때 사용한다.

<script>
  let i = 0
  
  while (confirm('계속 진행하시겠습니까?')) {
    console.log(`$[i}번째 반복입니다.`)
    i = i + 1
  }
</script>

 

break와 continue

 

반복문에 break와 continue를 적절히 사용하면 간결한 코드 작성이 가능하다.

 

break는 switch 조건문이나 반복문을 벗어나도록 하는 키워드를,

 

continue는 반복문 안의 반복 작업을 멈추고 반복문의 처음으로 돌아가 다음 반복 작업을 진행하도록 하는 키워드를 나타낸다.

 

 

 

 

 

---

이 글은 혼자 공부하는 자바스크립트 (윤인성 저)를 바탕으로 공부한 내용을 작성한 글입니다.