B25 : 객체 메서드 Object.keys, values, entries

목차

1. 순회(iteration)

2. Object.keys, values, entries

3. 객체에 배열 전용 메서드 사용하는 법

---

1. 순회 (iteration)

Map, Set, Array(iterable 객체)에서 사용하는 메서드 keys(), values(), entries()와

일반 객체(iterable 아님)에서 사용하는 메서드 keys(), values(), entries()는 문법 차이가 있다.

• Object.keys(obj) : 객체의 키만 담은 배열 반환
• Object.values(obj) : 객체의 값만 담은 배열 반환
• Object.entries(obj) : [키, 값] 쌍을 담은 배열을 반환

 

---

2. Object.keys, values, entries

일반 객체와 iterable 객체의 메서드들의 차이를 알아보자.

 

1. obj.keys()가 아닌 Object.keys(obj)를 호출

문법이 다른 이유는 유연성 때문이다.

JS는 객체를 기반으로 다양하고 복잡한 자료구조/커스텀 메서드를 구현하기 때문에 유연성이 필요하다.

Object.values(data)와 같은 형태로 메서드를 호출하면 커스텀 메서드와 내장 메서드 모두를 사용할 수 있다.

 

2. Object.* 호출 시 iterable 객체가 아닌 '배열'을 반환

진짜 배열을 반환하는 이유는 하위 호환성 때문이다.

let user = {
  name: "John",
  age: 30
};

// Object.keys(user) = ["name", "age"]
// Object.value(user) = ["John", 30]
// Object.entries(user) = [ ["name", "John"], ["age", 30] ]

for (let user of Object.values(user)) {
  alert(value);	// Violet, 30
}

Object.values를 사용하여 프로퍼티 값을 대상으로 원하는 작업을 할 수 있다.

 

 

---

3. 객체에 배열 전용 메서드 사용하는 법

원래 객체에는 map, filter같은 배열 전용 메서드를 사용할 수 없다.

하지만 Object.entries, Object.fromEntries를 순차적으로 적용하여 객체에서도 배열 전용 메서드를 사용할 수 있다.

 

1. Object.entries(obj)로 배열 얻기(객체의 [키, 값] 쌍을 요소로 함)

2. 1에서 만든 배열에 배열 전용 메서드를 적용

3. 2에서 반환된 배열에 Object.fromEntries(array)를 적용해 배열을 다시 객체로 되돌림

 

 let prices = {
  banana: 1,
  orange: 2,
  meat: 4,
};

let doublePrices = Object.fromEntries(
  Object.entries(prices).map(([key, value]) => [key, value*2])
};

alert(doublePrices.meat);	// 8

 

 

 

 

참고

https://ko.javascript.info/keys-values-entries