[내일배움캠프] TIL_230106

JungHoon Han·2023년 1월 6일
0

내일배움캠프

목록 보기
47/78

오늘의 문제

  1. html페이지의 main부분을 js파일에서 db에 있는걸 가져와 뿌려주는데 querySelector로 뿌려준 코드의 상태에따라 style을 변경하려고 하니 뿌려지기전에 변수선언이 먼저되고 그걸 바꾸려고 하니 Uncaught TypeError: Cannot read property 'style' of null 에러가 뜸.
  2. 내가 신청한 리스트 + 내 신청을 진행한 shopname들의 리스트를 가져오고 싶은데(fk로 연결되어있음) 내가 신청한 리스트는 가져오는데 이 여러개의 리스트의 개별 shop_name은 어떻게 가져와야할지 모르겠었다.( 내가신청한리스트[0].shopname 이런식으로 해야 출력이 되어서)
  3. (2) 에서 해결한 문제를 가공하여 response로 보내주려고 하는데 map()메서드를 사용해서 보내는데 console.log에서는 잘 찍히는데 리턴보낼때 자꾸 에러가뜸.

내가 시도해본 것

1-1. 변수선언의 위치를 바꿔봄
1-2. append할 html코드에 ${}으로 인라인 스타일 값을 줘볼까 함.
2. 레파짓토리 부분에서 for문을 돌려봐야하나 서비스 부분에서 map함수를 돌려야 하나 시도해봤다.
3. 변수에 담아 보내보려고 시도해보고, 콘솔로 찍어봄

어떻게 해결했나

  1. 프로젝트 마감시간 때문에 아직 구현하지 못했다.
  2. 내가신청한리스트를 가져오는 부분에서 include: { model: shop } 을 하니 innerJoin이 되었다.
  3. 출력값이 null이라 발생하는 문제였다. optional chaining이란걸 튜터님이 알려주셨는데 기존에 shop_name: data.dataValues.shop.dataValues.shop_name
    이런식으로 작성했는데 만약 shop이 null || undefined 이면 그부분에서 ^ 에러가 발생하였다. 하지만 optional chaining을 사용하면 data가 없을시 에러를 발생시키지 않고 undefined를 리턴한다. 연결된 객체사이에 ?를 넣어주면 된다.
    shop_name: data?.dataValues?.shop?.dataValues?.shop_name
    MDN 참고문서

새롭게 배우거나 깨달은건 무엇인가

  1. 어제도 비슷한 경험을 했었는데, 조금 더 컴퓨터의 언어로 생각해봐야 겠다.
  2. innerJoin으로 데이터를 여러번 가져왔는데, 항상 join된 데이터를 가져오는 메서드를 따로써서 return을 시키고 있었다. 그동안 내가 효율적이지 못하게 사용하고 있었구나 라고 깨달았다.
  3. 옵셔널 체이닝이라는 정말 나에게는 혁명적인 기술같이 느껴졌다. 정말 내가 공부하고 알아야할게 너무나도 많다는걸 느꼈다.
profile
Node.js 주니어 개발자

0개의 댓글