자바스크립트 + 리액트 디자인 패턴

172

자바스크립트 + 리액트 디자인 패턴

jQuery

의

on

()

메서드는 이벤트를 발생시키는

DOM

요소가 너무 많은 경우에 활용하면 좋

은 예시입니다.

10

개,

20

개,

200

개 이상의

DOM

요소에 각각 ‘클릭’ 이벤트를 등록하는 것은

애플리케이션의 성능과 사용자 경험을 떨어뜨릴 수 있습니다. 그 대신

jQuery

의

on

()

메서

드를 사용하면 수많은 개별 이벤트 핸들러를 단 하나의 핸들러로 대체할 수 있습니다.

이벤트 집합 패턴은 간접적인 관계를 가진 객체 간의 소통이 필요한 상황에서도 유용하게 활

용됩니다. 최신 애플리케이션에서는 직접적인 연관성이 없는 다수의 뷰 객체들이 상호작용

하는 것이 일반적입니다. 예를 들어 메뉴 시스템을 구성할 때 메뉴 항목의 클릭 이벤트를 처

리하는 전용 뷰가 있을 수 있습니다. 하지만 메뉴가 세부 내용을 표시하는 뷰와 강하게 결합

될 경우 코드의 유지보수가 어려워지므로 바람직하지 않습니다. 이러한 문제를 해결하기 위

해 이벤트 집합 패턴을 사용할 수 있는데,

menu

:

click

:

foo

같은 이벤트를 호출하여 해당 이

벤트를 처리하는 ‘

foo

’ 객체가 화면에 관련 내용을 표시하도록 할 수 있습니다.

7.19.4

중재자 패턴의 활용

중재자 패턴은 두 개 이상의 객체가 간접적인 관계를 가지고 있고 비즈니스 로직이나 워크플

로에 따라 상호작용 및 조정이 필요한 경우에 유용합니다. 마법사

wizard

형식의 인터페이스는

이러한 적용 사례의 대표적인 예시입니다.

orgChart

예제에서 살펴본 것처럼 마법사 인터페 ...