for ... in, for ... of

1. for ... in

  for ... in 구문은 대상 객체 안에 있는 프로퍼티에 하나씩 접근한다. 실제값을 가져오는 것이 아니라 프로퍼티를 가져오기 때문에 실질적으로 유용하진 않다. 일반적으로 반복하는 목적은 값이 대상이지 값을 가리키는 프로퍼티가 대상이 아니다.

var customerJson = {
    "name": "anb",
    "time": 20210510,
    "nickname": "annnb",
    tier: {
    	cook: "bad",
        song: "bad",
        lol: "good"
    }
};

for(var property in customerJson) {
	console.log(`${property} : ${typeof customerJson[property]}`);
}

// expected output
// "name : string"
// "time : number"
// "nickname : string"
// "tier : object"

 

2. for ... of

  for ... of 구문은 대상 객체 안에 있는 실제값을 개별적으로 가져온다. 일반적으로 Collection 객체를 대상으로 사용되며 배열(Array), 맵(Map), 집합(Set)에서 주로 사용된다.

const arr = [
    'a',
    {
    	"name": "anb",
        "etc": 4
    },
    'c'
];

for (const element of arr) {
    console.log(typeof element);
}

// expected output
// "string"
// "object"
// "string"