F.E/JavaScript

[JavaScript] 리스트 순회, for문, for of문, for in문, for each문

pinomaker 2022. 8. 9. 11:02

리스트 순회란 리스트(배열)에 있는 값을 전부 돌린다는 것을 의미한다.

기존의 ES5에서는 for문을 이용한 리스트 순회를 하였지만, ES6가 생기면서 다양한 방법이 생겼다.

 

For 문을 이용한 리스트 순회

가장 기본적인 순회 방법이다.

//ES5
var list = [1,2,3,4,5]
for (var i = 0; i<list.length; i++){
  console.log(list[i])
}
// 1, 2, 3, 4, 5

var str = "abc"
for (var i = 0; i<str.length; i++){
  console.log(tsr[i])
}
// a, b, c

 

For of를 이용한 리스트 순회

Symbol.iterator를 가진 리스트들만 사용이 가능하다.

//ES6
const list = [1,2,3,4,5]
for(const a of list){
  console.log(a)
}
// 1, 2, 3, 4, 5

const str = "abc"
for(const a of str){
  console.log(a)
}
// a, b, c

 

 

For In을 이용한 리스트 순회

객체의 속성을 열거하는 순회 방법이다.

const list = {
    a: 1, 
    b: 2, 
    c: 3
}

for (key in list) {
    console.log(key, list[key]) 
}
// a 가, b 나, c 다

 

For Each를 이용한 리스트 순회

Array, Map, Set객체에 사용 가능한 메서드다.

const list = [1, 2, 3, 4, 5];

list.forEach((item,index,arr2) => {
    console.log(item,index,arr2[index+1]);
})

// 1, 2, 3, 4, 5

// forEach의 매개 변수
// 1. 배열의 각각의 item
// 2. 배열의 index
// 3. 배열