본문 바로가기

FRONT-END/JAVASCRIPT

자바스크립트 디자인 패턴 #정리

반응형

자바스크립트 디자인 패턴 정리


모듈패턴은 글로벌 변수를 최소화하고 라이브러리나 API의 소스 관리에 유용하다.


이벤트 델리게이션 패턴은 여러 DOM에 이벤트 핸들러를 걸러야 하는 경우와 동적인 DOM의 이벤트 처리를 해야하는 경우 유용하다.


이벤트 처리 단계는 [캡처링]-[대상]-[버블링]의 3단계로 이루어져있다.


프락시 패턴을 통해 캐시를 활용하거나 여러 개의 요청을 하나로 합쳐서 서버 요청을 최적화하거나 외부 인터페이스를 간편하게 만들 수 있다.


프락시 패턴과 이벤트 델리게이션 패턴을 조합하면 확장성 있는 이벤트 처리가 가능하다.


데커레이터 패턴은 반복되는 기능의 조합을 조금씩 변경해서 사용하는 경우 유용하며 디버깅을 위한 로깅 툴의 으용이 가능하다.


Init-time branching 패턴은 브라우저 호환성을 지원하기 위하여 많이 사용하는 패턴이다.


브라우저 호환성을 지원하는 함수에서는 브라우저 종류, 버전 기준이 아닌 기능 존재 여부로 호환성 지원을 판단하는 것이 좋다.


Self-defining function 패턴은 초기화 작업이 매번 필요한 함수나 클로저에 초기화 내용을 저장해야하는 함수에 활용하면 좋다.


메모이제이션 패턴은 캐시와 같은 기능을 수행하여 성능과 서버 요청 최적화에 유용하다.


Self-invoking constructor 패턴은 함수 기반의 객체지향을 개발하는 경우 방어적인 코딩으로 활용하면 좋다.


콜백 패턴은 이벤트 기반으로 동작하는 자바스크립트에서 유용하며, 비동기 요청에 대한 순서 보장에 활용하면 좋다.


커링 패턴은 하나의 공용함수가 있는 경우 이를 세부적인 기능을 하는 함수로 나누고 싶을 때 유용하다.


출처-속깊은 자바스크립트 양성익 지음

반응형