JS에서 for in 과 for of의 차이점

자바스크립트를 공부하며 자바스크립트의 for문에 대해 알게된 내용을 기록하고자 한다.

 

✅ for of

먼저 for of는 배열을 순회할 때 사용되는 for문이다.

const num = [10,20,30]

for(i of num){
    console.log(i);
}

 

 

배열내 요소들을 순차적으로 가져와 출력한다.

그렇다면 for of를 사용해 객체를 순회하면 어떻게 될까

const num = [10,20,30]

let object = {
    a : 3,
    aaaaaa : "소고기",
    cccdd : "spring",
    number : num
}

for(o of object){
    console.log(o);
}

 

 

오류가 발생했다. 순회할 수 없단다.

✅for in

for in은 객체 내 요소들을 순환할 때 사용하는 for문이다.

 

const num = [10,20,30]

for(n in num){
    console.log(n);
}

 

 

먼저 배열에 for in 을 사용해 순회하게 되면 배열의 인덱스들을 결과값으로 반환하고

 

const num = [10,20,30]

let object = {
    a : 3,
    aaaaaa : "소고기",
    cccdd : "spring",
    number : num
}

for(o in object){
    console.log(o);
}

 

객체에 사용해 순회하게 되면 객체의 멤버 이름?을 가져온다.

 

객체 내 멤버들에 저장된 값(value)를 가져오려면

for(o in object){
    let value = object[o]
    console.log(value);
}

 

위와같은 방법을 사용하면 된다.

뭔가 map의 key : value인거 같은 느낌이 든다.