상세 컨텐츠

본문 제목

Object.keys(), Object.values(), Object.entries()

JavaScript

by 폴리프레임 2024. 9. 30. 21:37

본문

반응형

모든 객체가 이터러블인 것은 아닙니다.  객체 자체가 Symbol.iterator를 구현하지 않아서 for...of 같은 반복문에서 사용할 수 없는 경우에는, 위의 3가지 경우을 이용, 반복하여 내부의 요소에 접근 할 수가 있습니다.  

const obj = { a: 1, b: 2 };

// for...of 사용 불가 (오류 발생)
for (let value of obj) {
  console.log(value);
}
// TypeError: obj is not iterable

이터러블 내장객체와 달리, 일반 객체를 반복하려면 Object.keys()나 Object.values(), 또는 Object.entries() 같은 메서드를 사용해야 합니다. 이 메서드들은 객체의 속성을 배열로 반환하며, 배열은 이터러블이기 때문에 이를 순회할 수 있습니다.

const obj = { a: 1, b: 2 };
const entries = Object.entries(obj);

for (let [key, value] of entries) {
  console.log(key, value); // 'a' 1, 'b' 2
}
const object1 = {
  a: 'somestring',
  b: 42,
  c: false,
};

const obj1 = Object.keys(object1);
for (let val of obj1) {
    console.log(val)
}
// a
// b
// c
const object1 = {
  a: 'somestring',
  b: 42,
  c: false,
};

const obj1 = Object.values(object1);
for (let val of obj1) {
    console.log(val)
}

// somestring
// 42
// false

 

JavaScript의 다양한 내장 객체들은 이터러블 프로토콜을 따르며, for...of 루프를 사용할 수 있습니다.

이터러블을 지원하는 주요 객체는 다음과 같습니다:

  • Array: 배열의 각 요소를 순회할 수 있습니다.
  • String: 문자열의 각 문자를 순회할 수 있습니다.
  • Map: Map 객체는 각 key-value 쌍을 순회할 수 있습니다.
  • Set: Set 객체는 각 값을 순회할 수 있습니다.
  • arguments 객체: 함수 내부에서 사용할 수 있는 특별한 객체로, 이터러블입니다.
  • NodeList: DOM에서 반환되는 노드 목록도 이터러블입니다.

 

참고 : iterable object, iterator

관련글 더보기