Javascript

Lookup Table, Computed Property Name 활용 코드개선

변기원 2022. 12. 20. 14:39

최근에는 회사에서 격무에 시달리고 사이드로 백엔드 개발에도 도전하게 되어 블로그를 작성하지 못했는데

유데미에서 Poco Jang님의 클린코드 자바스크립트 강의를 듣고 기존 코드의 작은 부분을 수정한 기록을 남깁니다.

기존코드

constants폴더에 상수들을 담고 있는 배열을 선언한다.

printRefundReason함수는 RSN001, RSN002 같은 code를 인자로 받고 배열에서 filter함수를 통해

배열의 각 요소중 code가 인자로 받은 code와 일치하는 객체를 찾아내고 그 객체의 name을 반환한다.

문제점: filter를 사용해야 하기 때문에 지역변수를 하나 선언해야 하고

filter가 새 배열을 리턴해주므로 target[0]으로 접근하는 방식도 직관적이지 못하고 의도를 파악하려고 노력하게 만든다.

 

수정코드

Lookup Table은 자바스크립트의 용어는 아니고 엑셀에서 사용하는

이런 key, value형태를 갖춘 테이블을 Lookup Table이라고 하는 것 같다.

쉽게 말하면 객체를 하나 만드는 건데

printRefundReason에서 code로 받는 인자명과 일치하는 key들을 만들고 반환하고 싶은 텍스트를 value로 만든다.

그리고 Computed Property Name을 활용해서

PartialCancelReason[code]로 동적인 키로 객체의 키에 접근해서 value를 그대로 반환해준다.

함수 안에 없어도 되는 지역변수가 없어졌고 함수의 return 부분에서 코드만 읽어도 의도 파악이 가능하다.