[javascript] 컬렉션 정리

요즘 프론트엔드 업무를 하게 되면서 자료를 변환하는 일을 많이 하게 됐다.

자주 쓰는 패턴을 정리해본다.

1. keyset, valueset 합치기

// k, v로 k_v를 만들고 싶을 때
const k = ['a', 'b', 'c', 'd'] 
const v = [1,2,3,4]
let k_v // {'a': 1, 'b': 2, 'c': 3, 'd': 4}

// lodash 사용 시
k_v = _.zipObject(k, v);

// 구현
k_v = k.reduce((obj, val, idx)=>({...obj, [val]: v[idx]}))

2. list와 list group 합치기

// 다음과 같은 그룹에서 objs에 해당하는 리스트를 모두 더하고 싶을 때
const objsOwners = [
  { objs: [{service: 'a1', owner: 'b1' }, {service: 'c1', owner: 'd1' }] },
  { objs: [{service: 'a2', owner: 'b2' }, {service: 'c2', owner: 'd2' }] },
  { objs: [{service: 'a3', owner: 'b3' }, {service: 'c3', owner: 'd3' }] },
]
const objs = {objs: {service: 'e1', owner: 'f1' }}

// 구현
const objsFromGroup = objsOwners
  .map(o=>o.objs) // 원하는 데이터 뽑아내고
  .flat()         // 뭉개서
  .concat(objs)   // 합칩니다

3. 필터 항목 삭제

// 아래 데이터 중, type이 a 인걸 제외하고 싶을 때
const a = [ 
  { type: 'a', name: 'a1' },{ type: 'b', name: 'a2' },
  { type: 'a', name: 'a3' },{ type: 'b', name: 'a4' } ]
let result

// 방법1
result = a.reduce((p,c) => ( !(c.type === "a") && p.push(c),p),[]);

// 방법2
result = a.reduce(
  function(pre,cur){
    if (! (cur.type === 'a')){
      pre.push(cur);
    }
    return pre;
  }, [])

출처 : https://stackoverflow.com/questions/37385299/filter-and-delete-filtered-elements-in-an-array

방법1과 방법2는 같지만, 방법1의 경우, 모호한 리턴값을 가지게 된다. (code smell ...)