[javascript] for ... in VS Object.keys()

자바스크립트 객체 루프하는 방법의 차이를 알아보자.

 

var par = { prop1: "some val", someMethod: () => "value" };
var obj = Object.create(par);
obj.prop2 = "some other val";

// obj prototype은 par
console.log(Object.getPrototypeOf(obj) === par); // true

// 상속된 prototype의 property까지 탐색
for (const key in obj) {
  console.log("Key: ", key, "Value: ", obj[key]);
}
// "Key: ", "prop2", "Value: ", "some other val"
// "Key: ", "prop1", "Value: ", "some val"
// "Key: ", "someMethod", "Value: ", () => "value"

// 자체 property만 탐색
Object.keys(obj).forEach((key) => {
  console.log("For Each Key: ", key, "Value: ", obj[key]);
});
// "For Each Key: ", "prop2", "Value: ", "some other val"

https://jsfiddle.net/tzbxvkp1/1/