[TIL] for for for 친구들

choiuhana·2021년 8월 12일
0

TIL

목록 보기
25/37

기업협업 프로젝트를 하던 중 하나의 객체를 여러개의 객체로 나눠야 할 상황이 생겼다, 고민고민 하다 정준님의 도움으로 해결은 했는데 그동안 고민없이 써오던 entries와 for...in, for...of의 차이점을 깊이 생각 못했는데 이번기회를 통해 짧게 정리해보기로 하겠다.

Object.entires는 MDN 문서에 따르면 주어진 객체 자체의 enumerable 속성 [key, value] 쌍의 배열을 반환한다고 한다. 나는 그동안 객체를 배열화 시키는 용도로만 사용했는데(사실 그게 맞지만) 쌍의 배열이란 생각을 아예 못했던것 같다. 이를 활용해 for of와 함께 쓰면

for (const [key, value] of Object.entries(object1)) {
  console.log(`${key}: ${value}`);
}

이렇게 활용이 가능 하다, 이를 통해 내가 이번에 해결한 부분은

{
  '2021년 08월 10일': [
    { '1': 2, reiview: null },
    { '5': 3, reiview: {} }
  ],
  '2021년 08월 12일': [ { '3': 4, reiview: null } ],
  '2021년 08월 11일': [ { '5': 3, reiview: {} } ],
  '2021년 08월 1일': [ { '5': 3, reiview: {} } ]
}

이친구를

let listObj = {}
const listArr = []


for(const [key, value] of Object.entries(newObj) ){
  console.log(value)
  listObj = {[key]: value}
  listArr.push(listObj)
}

//활용해서 아래와 같이 만들 수 있었다.

  {
    '2021년 08월 10일': [
      { '1': 2, reiview: null },
      { '5': 3, reiview: {} }
    ]
  },
  {
    '2021년 08월 12일': [ { '3': 4, reiview: null } ]
  },
  { '2021년 08월 11일': [ { '5': 3, reiview: {} } ] },
  { '2021년 08월 1일': [ { '5': 3, reiview: {} } ] }

추가

MDN 문서에 따르면, for in 과 for of 의 차이는 (내 생각과는 달리 🤔) for in 은 객체에 활용을 하고 for of는 배열에 활용한다는 점이다. (왜 난 반대로 썻을까..)
for in을 배열에 쓸 경우 key로 인덱스를 리턴하기 때문이 아니었을까?..

profile
만드는 사람도 사용하는 사람도 편하고 만족하는 '것'을 추구하는 프론트엔드 개발자

0개의 댓글