TIL-24.04.29

 

 

 

 

문제점

공통적으로 함수의 인자로 들어가는 요소를 객체화 시키기

 

프로젝트 작성 중 함수의 인자로 들어가는 string때문에 수많은 에러 경험을 했다. 오타때문이다. 또 수많은 함수들의 인자로 들어가는 string의 값이 변경된다면 꼭 한두개 쯤은 빼먹고 수정하여 에러를 경험하기도 한다.

그래서 이를 해결하고자 함수의 인자로 들어가는 string을 오브젝트로 관리하는 법을 익혔다. 오브젝트의 키로 접근하기때문에 오타 발생률이 현저히 적어질것이라는 생각과, 내용 변경시 한곳에 모아 관리하기때문에 수정사항을 빼먹을 염려도 적어지겠다는 생각에 실행해보았다.

 

 

 

  export const ItemType = Object.freeze({
  read: 'read',
  sit: 'sit',
});

  
  onClick(event) {
    const target = event.target;
    if (target.matches('.read')) {
      target.remove();
      sound.playRead();
      this.onItemClick && this.onItemClick(ItemType.read);
    } else if (target.matches('.sit')) {
      this.onItemClick && this.onItemClick(ItemType.sit);
    }
  }

 

함수의 인자로 사용되는 'read', 'sit'을 최상단에 오브젝트로 관리했다. 오브젝트에 freeze기능까지 넣어 외부에선 객체의 속성들을 추가,수정,삭제 될수없게만들었다. 불변성과 안정성을 위해서다. 다른 js파일에서 해당 string을 인자로 받는 곳이 있다면 이 오브젝트를 모듈화해 한곳에서 충분히 관리하게끔만들었다.

 

 

 

 

 

알게된점

혹시나 모르는 에러발생률을 최대한 줄여보자.