순회를 할 때 필요한 메서드로 map.key( ), map.values( ), map.entries( )에 대해 알아봤다.
만약에 우리가 만든 자료구조를 대상으로 순회를 하려고 한다면, 위의 메서드들은 사용하지 못하고 직접 메서드를 구현해야 한다.

이것이 keys( ), values( ), entries( )이다.

✨ Object.keys( obj )

객체의 키만 담은 배열을 반환한다.

map.keys( )은 iterable 객체를 반환하는 반면, Object.keys(obj)는 진짜배열을 반환한다는 것이 차이이다.

👇 예제 코드를 살펴보자.

let dancer = {
  name : "seohee",
  age : 24,
  favoriteSong : "살짝설렜어"
};

여기서 key들을 반환하기 위해 Object.keys를 활용하면 키들이 순차적으로 담긴 배열이 반환된다.

✨ Object.values( obj )

객체의 값만 담은 배열을 반환한다.

👇 dancer에 들어있는 값들을 배열로 가져오기 위해 Object.values를 사용한다.

이를 활용하면 프로퍼티 값을 대상으로 우리가 원하는 작업을 수행할 수 있다.

for ( const info of Object.values(dancer)){
  console.log(info);
}

dancer의 정보인 이름, 나이, 좋아하는 곡이 순차적으로 출력된다.

✨ Object.entries( obj )

[ 키, 값 ] 쌍을 담은 배열을 반환한다.

👇 dancer의 프로퍼티들에 대해서 키, 값의 쌍을 담아오기 위해 Object.entries를 사용한다.

❗️ for ... in ❗️

👇 객체가 아닌 배열에서는 for ... in으로 순회를 하면, 요소의 값이 아닌 키를 순회한다.

때문에, 앞서 배운 메서들에서는 해당 키를 인덱스로 접근하여 0, 1, 2를 출력한다.

✨ 객체 변환하기

객체에는 map, filter와 같은 배열 전용 메서드를 사용할 수 없다.
하지만, Object.entries, Object.fromEntries를 순차적으로 적용한다면 객체에도 배열 전용 메서드를 사용할 수 있다.

사용방법
1. Object.entries(obj)를 통해 키, 값의 쌍인 요소를 배열로 반환한다.
2. 만들어진 배열에 map등의 배열 전용 메서드를 사용한다.
3. 2의 배열에 Object.fromEntries(array)를 적용하여 배열을 다시 객체로 변환한다.

👇 예제에 적용해보자.

let fruits = {
  orange : 12,
  apple : 1,
  strawberry : 24
};
// 1
let doubleFruits = Object.entries(fruits);
console.log(doubleFruits);

// 2
doubleFruits = doubleFruits.map(([key, value])=> [key, value*2]));
console.log(doubleFruits);

// 3
doubleFruits = Object.fromEntries(doubleFruits);
console.log(doubleFruits);

1의 작업을 통해 [키,값] 요소를 배열로 가져오고, 이에 대해 value * 2를 진행하여 배열을 바꿔준다.
완성된 배열을 3의 작업을 통해 객체로 변환한다.

📚 학습할 때, 참고한 자료 📚

• Object.keys, values, entries