[JS] 배열 for ... of 문

변수하나에, 다양한 값을 저장하기 위한 방법중 1가지는 배열이 있습니다.

 

자바스크립트에서 배열은 사실은 obejct입니다. 여기서는 이내용을 다룰 것은 아니며 순회 방법중 1가지를 알아보겠습니다.

 

자바스크립트 배열의 순회방법에는 for ... of 문법이 있습니다.

 

아래와 같은 배열이 존재할때,

 

const numbers = [1,2,3,4,5]

 

조건에 따라 순회시켜, 필요한 데이터만 출력해보도록 하겠습니다.

 

1. 기본적으로 배열 전체 조회

 

//기존 for문
const numbers = [1,2,3,4,5]

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

//for ... of 문

for (const number of numbers) {
  console.log(number)
}

 

2. 각 요소에 1씩 더해서 새로운 배열 생성

 

//기존 for문
const plusOneNumbers = []

for (let i = 0; i < numbers.length; i++){
    plusOneNumbers.push(i+2)
}
console.log(plusOneNumbers)


//for ... of 문
const plusOneNumbers = []
for (const number of numbers) {
  plusOneNumbers.push(number + 1)
}
console.log(plusOneNumbers)

 

3. 배열의 요소중 홀수만 출력

 

for문

const numbers = [1,2,3,4,5]
const oddNumbers = []

for(let i = 0; i<numbers.length; i++){
    if(numbers[i] %2){
        oddNumbers.push(numbers[i])
    }
}
console.log(oddNumbers)


//for ... of 문
const oddNumbers = []
for (const number of numbers) {
  if (number % 2) {
    oddNumbers.push(number)
  }
}
console.log(oddNumbers)

 

4. 배열의 각 요소들을 모두 더한 값을 구하기

 

for
const numbers = [1,2,3,4,5]
let total = 0;

for(let i = 0; i < numbers.length; i++){
    total += numbers[i]
}
console.log(total)




//for ... of

let total = 0
for (const number of numbers) {
total += number
}
console.log(total)

---

for of문보다 배열 고차함수를 주로 사용하겠지만, 간단한 경우에는 for문보다는 편할 것 같은데, 시간복잡도를 고려해봐야 할 것 같습니다.

 

 

22-08-25) 같은 소스코드라도 브라우저마다, 반복문마다 성능이 다를 수 있다는 점을 발견하였습니다.