on your mark
[JAVASCRIPT.INFO] 5.9 Object.keys, values, entries 본문
5.9 Object.keys, values, entries
keys()
, values()
, entries()
를 사용할 수 있는 자료구조는
Map
Set
Array
일반 객체에도 순회 관련 메서드가 있긴 한데, keys()
, values()
, entries()
와 문법에 차이가 있다.
Object.keys, values, entries
Object.keys(obj)
- 객체의 키만 담은 배열을 반환한다.Object.values(obj)
- 객체의 값만 담은 배열을 반환한다.Object.entries(obj)
-[key, value]
쌍을 담은 배열을 반환한다.
Map
, Set
, Array
전용 메서드와 일반 객체용 메서드의 차이를 비교하면 아래와 같다.
맵 | 객체 | |
---|---|---|
호출문법 | map.keys() |
Object.keys(obj) |
반환 값 | iterable 객체 | '진짜' 배열 |
obj.keys()
가 아닌Object.keys(obj)
를 호출한다.
맵과 문법이 다른 이유는 유연성 때문이다. 자바스크립트에선 복잡한 자료구조 전체가 객체에 기반한다. 그러다 보니 객체data
에 자체적으로data.values()
라는 메서드를 구현해 사용하는 경우가 있을 수 있다. 이렇게 커스텀 메서드를 구현한 상태라도object.values(data)
같은 형태로 메서드를 호출할 수 있으면, 커스텀 메서드와 내장 메서드를 둘 다 사용할 수 있다.Object.*
를 호출하면 iterable 객체가 아닌 객체의 한 종류인 배열을 반환한다.let user = { name: "John", age: 30 }
Object.keys(user) = ["name", "age"]
Object.values(user) = ["John", "30"]
Object.entries(user) = [["name", "John"], ["age", 30]]
Object.keys, values, entries는 심볼형 프로퍼티를 무시한다.
for .. in
반복문처럼, Object.keys, values, entries는 키가 심볼형인 프로퍼티를 무시한다.
객체 변환하기
객체엔 map
, filter
같은 배열 전용 메서드를 사용할 수 없다.
하지만, Object.entries
, Object.fromEntries
를 순차적으로 적용하면 객체에도 배열 전용 메서드를 사용할 수 있다.
Object.entries(obj)
를 사용해 객체의 키-값 쌍이 요소인 배열을 얻는다.- 1에서 만든 배열에
map
등의 배열 전용 메서드를 적용한다. - 2에서 반환된 배열에
Object.fromEntries(array)
를 적용해 배열을 다시 객체로 되돌린다.
'WEB > Javascript' 카테고리의 다른 글
[JAVASCRIPT.INFO] 5.10 구조 분해 할당 (0) | 2023.01.12 |
---|---|
[JavaScript] tilde(~) 연산자 (0) | 2023.01.12 |
[JAVASCRIPT.INFO] 5.8 위크맵과 위크셋 (0) | 2023.01.10 |
[JAVASCRIPT.INFO] 5.7 맵과 셋 (0) | 2023.01.09 |
[JAVASCRIPT.INFO] 5.6 iterable 객체 (0) | 2023.01.09 |