Programming Language/JavaScript
[JavaScript] Object.entries(obj)가 반환하는 건 맵이 아닌 '배열'이다!
devRobin
2022. 11. 19. 12:35

나는 문제를 풀다가 크나큰 착각을 하고야 말았다!!
내가 무슨 착각을 했는지는 거두절미하고 바로 문제를 풀며 알아보자.
문제: 프로퍼티 개수 세기
객체 프로퍼티 개수를 반환하는 함수 count(obj)를 만들어보세요.
let user = {
name: 'John',
age: 30
};
alert( count(user) ); // 2
가능한 짧게 코드를 작성해 보세요.
주의: 심볼형 프로퍼티는 무시하고 ‘일반’ 프로퍼티 개수만 세주세요.
정말 쉬워보이는 문제라 금방 코드를 쓰고 실행을 했다.
그런데 어라..? 출력 결과가 이상하게 나왔다.
내가 쓴 코드(틀림)
let user = {
name: 'John',
age: 30
};
console.log( count(user) );
function count(obj) {
return Object.entries(obj).size;
}

어라?
출력 결과로 2
가 나와야하는데 왜 undefined
가 나오는 거지...?

내가 생각한 방법은 다음과 같았다.
1.Object.entries(obj)
로 자료구조를 '맵'으로 만들어주자. 😊
2.Object.entries(obj).size
를 해줘서 요소의 개수를 반환하면 끝! 😆
...
이 포스팅으 읽는 여러분은 내가 어디에서 착각을 했는지 눈치 챘을까?
그렇다.
이 포스팅의 제목 그대로
Object.entries(obj)
가 반환하는 건 맵이 아니다! 단순한 배열이다!!!
Object.entries(obj)를 맵으로 바꾸는 방법
Object.entries(obj)는 [키, 값]
쌍을 담은 배열을 반환한다.
예시:
let user = {
name: "John",
age: 30
};
console.log( Object.entries(user) );

실행된결과가 맵과 유사해보이는 바람에 맵으로 착각해버렸다. 그러나!!! 명심하자!!! 이건 단순한 배열일뿐이다!!
맵은 new Map()
메서드로만 생성할 수 있다.
그러므로 Object.entries(obj)의 결과를 맵으로 바꾸고 싶으면 다음과 같이 쓰면 된다.
let map = new Map(Object.entries(obj));
이걸 문제에 적용하면 다음과 같다.
let user = {
name: 'John',
age: 30
};
console.log( count(user) ); // 2
function count(obj) {
return new Map(Object.entries(obj)).size;
}

이렇게 하면 원하는대로 프로퍼티 개수를 구할 수 있다.

참고로 공식 답안은 다음과 같다.
function count(obj) {
return Object.keys(obj).length;
}
참고 문서
https://ko.javascript.info/map-set#ref-196
맵과 셋
ko.javascript.info