Javascript | Object.keys, values, entries

space's pace·2022년 6월 28일
0

Javascript

목록 보기
7/20

개별 자료 구조에서 한발 뒤로 물러나 순회(iteration)에 관해 이야기 나누어봅시다.

이전 챕터에서 우리는 순회에 필요한 메서드 map.keys(), map.values(), map.entries()에 대해 알아보았습니다.

이 메서드들은 포괄적인 용도로 만들어졌기 때문에 메서드를 적용할 자료구조는 일련의 합의를 준수해야 합니다. 커스텀 자료구조를 대상으로 순회를 해야 한다면 이 메서드들을 쓰지 못하고 직접 메서드를 구현해야 합니다.

keys(), values(), entries()를 사용할 수 있는 자료구조는 다음과 같습니다.
Object.keys()
Map
Set
Array
일반 객체에도 순회 관련 메서드가 있긴 한데, keys(), values(), entries()와는 문법에 차이가 있습니다.Object.keys, values, entries
일반 객체엔 다음과 같은 메서드를 사용할 수 있습니다.

Object.keys(obj) – 객체의 키만 담은 배열을 반환합니다.
Object.values(obj) – 객체의 값만 담은 배열을 반환합니다.
Object.entries(obj) – [키, 값] 쌍을 담은 배열을 반환합니다.
Map, Set, Array 전용 메서드와 일반 객체용 메서드의 차이를 (맵을 기준으로) 비교하면 다음과 같습니다.

맵 객체
호출 문법 map.keys() Object.keys(obj)(obj.keys() 아님)
반환 값 iterable 객체 ‘진짜’ 배열
첫 번째 차이는 obj.keys()가 아닌 Object.keys(obj)를 호출한다는 점입니다.

이렇게 문법이 다른 이유는 유연성 때문입니다. 아시다시피 자바스크립트에선 복잡한 자료구조 전체가 객체에 기반합니다. 그러다 보니 객체 data에 자체적으로 data.values()라는 메서드를 구현해 사용하는 경우가 있을 수 있습니다. 이렇게 커스텀 메서드를 구현한 상태라도 Object.values(data)같은 형태로 메서드를 호출할 수 있으면 커스텀 메서드와 내장 메서드 둘 다를 사용할 수 있습니다.

두 번째 차이는 메서드 Object.*를 호출하면 iterable 객체가 아닌 객체의 한 종류인 배열을 반환한다는 점입니다. ‘진짜’ 배열을 반환하는 이유는 하위 호환성 때문입니다.

Object.values()

Object.values() 메소드는 전달된 파라미터 객체가 가지는 (열거 가능한) 속성의 값들로 이루어진 배열을 리턴합니다.
이 배열은 for...in 구문과 동일한 순서를 가집니다. (for in 반복문은 프로토타입 체인 또한 열거한다는 점에서 차이가 있습니다.)


Object.values()

Object.entries()

Object.entries() 메서드는 for...in와 같은 순서로 주어진 객체 자체의 enumerable 속성 [key, value] 쌍의 배열을 반환합니다.
(for-in 루프가 다른점은 프로토 타입 체인의 속성도 열거한다는 점입니다).

Object.entries() 에 의해 반환된 배열(array)의 순서는 객체가 정의된 방법과 관련이 없습니다.
배열 순서가 쓸 곳이 있다면, 다음과 같이 정렬을 먼저 하시는 것이 좋습니다 Object.entries(obj).sort((a, b) => b[0].localeCompare(a[0]));.

profile
블로그 이사 준비중!

0개의 댓글