오늘의 삽질 - Why we have to use TypeScript.

이동규 (Justin)·2020년 11월 21일
0

프로젝트를 개발하던 중, 타입스크립트를 사용했더라면 막을 수 있었던 참사의 경험이 있어 공유한다.

클라이언트가 유저의 아이디 (userId)를 서버로 보내 특정 meeting document의 배열에 들어있는 파트너 닉네임을 가져오려는 일을 수행하던 도중 계속해서 파트너 닉네임이 유저 자신의 닉네임과 똑같이 오는 현상을 경험했다.

문제는 서버에서 파트너 아이디를 가져오는 부분에서 userId와 participant 객체의 _id를 비교하는 과정에서 찾을 수 있었다.

find를 사용하여 비교하면서, participant의 _id는 mongodb 의 ObjectId 타입이었는데, userId는 스트링이었기 때문에 실제로 다른 닉네임을 찾아낸 것이 아니라 배열에 가장 첫번째로 들어있는 객체의 아이디를 계속해서 가져와버린 것이다.


meeting = {
  ...
  participant: [
    { _id: 3d2d92da21q, nickname: '앱만드는 인기남' },
    { _id: 238df2fa3230, nickname: '당찬 무라카미 하루키' },
    ...
  ]
}
    
userId = '3d2d92da21q' // 앱만드는 인기남
    
const partner = meeting.participant.find(p_obj => p_obj._id !== userId);
  
// partner.nickname은 '당찬 무라카미 하루키' 일 것으로 예상되었으나 userId와 앱만드는 인기남 객체의 _id가 타입이 달랐기 때문에 partner.nickname은 항상 앱만드는 닉네임 이 되었다.

만약 타입스크립트로 함수 인자에 타입을 명시했더라면 이러한 에러를 빌드타임에 확인할 수 있었을 것이며, 이렇게 오랜 시간을 디버깅에 쓰지 않아도 되었을 것이다!


오늘의 교훈 - Backend API를 만든 후에는 항상 테스트를 하고 커밋하자.
오늘의 교훈2 - find를 하거나 비교연산자를 사용할 때에는 항상 타입에 유의하자. (개발할 때 콘솔로 확인하자..)

...가 아니라, 그냥 타입스크립트를 학습하고 사용하자.

shout out to @coin46

profile
Frontend Developer, JamStack, Ethereum

0개의 댓글