[Object] Object 다루기 - map, filter 로 값 추출하기

Object(객체) 다루기

---

Object(객체) 란 무엇인가?

1. key: value 쌍을 가지는 자료구조입니다.

2. value 에 문자, 숫자, 배열, 객체, 함수를 할당할 수 있습니다.

 

1. 오브젝트 데이터 생성

const objPersons = {
  persons: [
    {name: "kim", age: 20, gender: "man"}, 
    {name: "vicky", age: 22, gender: "women"},
    {name: "gloria", age: 42, gender: "women"},
    {name: "gom", age: 27, gender: "man"},
  ]
};

Object 안에 Array 가 있고, 그 Array 안에 다시 Object가 배치되어있습니다.

objPersons는 현재 { key: [ {key: value}, {key: value}, {key: value}, {key: value} ] } 이러한 형식과 동일합니다.

 

2. 오브젝트 데이터 가공하기

const {persons} = objPersons
// ES5: const persons = Object.assign([], objPersons.persons)와 동일
const mapPersons = Object.values(persons).map(v => Object.keys(v).map(v2 => v[v2]))
const filteredPersonsAge = persons.filter( v => v.age > 25 )

작업 순서대로 나열해 보겠습니다.

1. objProject 에서 persons 만 빼와서 블록상수로 참조합니다.

2. persons의 value들을 돌며 key와 일치하는 값들을 mapPersons에 새로운 배열을 반환합니다.

3. persons의 value들을 돌며 일치한 값만 filteredPersonsAge에 새로운 배열을 반환합니다. 

 

3. 값 확인하기

console.log(persons)
>>> [ 
  { name: 'kim', age: 20, gender: 'man' },
  { name: 'vicky', age: 22, gender: 'women' },
  { name: 'gloria', age: 42, gender: 'women' },
  { name: 'gom', age: 27, gender: 'man' } 
]

console.log(mapPersons)
>>> [
  [ 'kim', 20, 'man' ],
  [ 'vicky', 22, 'women' ],
  [ 'gloria', 42, 'women' ],
  [ 'gom', 27, 'man' ] 
]

console.log(filteredPersonsAge)
>>> [
  { name: 'gloria', age: 42, gender: 'women' },
  { name: 'gom', age: 27, gender: 'man' } 
]