[백지연] 챕터 7: 자바스크립트 디자인 패턴 (3/3)

챕터_7/백지연.md

@@ -523,4 +523,118 @@ export default CreateClassWithMixinComponent;
 - 👍 : 데코레이터 패턴 (베이스 객체에 속성이나 메서드를 추가해 간소화)
 - 👎 : 서브클래싱 (늘어가는 능력의 수를 감당할 수 없음)
 
+#### 장점
+
+- 베이스 객체 변경 걱정 없이 사용 가능
+- 수많은 서브클래스에 의존할 필요 없음
+
+#### 단점
+
+- 애플리케이션 구조를 복잡하게 만들 수도 있음
+- 데코레이터 패턴에 익숙하지 않은 개발자는 목적을 파악하기 어려워 관리 힘들어짐
+
+</details>
+
+<details>
+<summary>플라이웨이트 패턴</summary>
+
+## 플라이웨이트 패턴
+
+#### 정의
+
+반복되고 느리고 비효율적으로 **데이터를 공유**하는 코드를 최적화하는 구조적 해결 방법
+
+#### 특징
+
+- 연관된 객체끼리 데이터를 공유
+- **메모리 공간의 경량화**, **메모리 절약**이 목표
+- 객체마다 데이터 저장 (x) 하나의 의존 외부 데이터에 모아서 데이터 저장 (o)
+
+#### 예시
+
+- **데이터 레이어**, **DOM 레이어**에서 플라이웨이트 패턴 사용
+
+</details>
+
+## 행위 패턴
+
+행위 패턴은 **객체 간의 의사소통을 돕는 패턴**
+
+<details>
+<summary>관찰자 패턴</summary>
+
+## 관찰자 패턴
+
+#### 정의
+
+한 객체가 변경되었음을 다른 객체들에게 알려주는 패턴
+
+#### 특징
+
+- 한 객체(subject)를 관찰하는 여러 객체들(object)이 존재
+- 주체의 상태가 변화하면 관찰자들에게 자동으로 알림을 보냄
+- 자바스크립트 환경에서는 관찰자 패턴보다 Publish/Subscribe 패턴을 사용하고 있음
+- 시스템의 구성 요소 간에 **느슨한 결합**을 도모한다는 것이 핵심
+
+#### 장점
+
+- 구성 요소 간의 관계를 고민해 볼 수 있는 기회
+- 구성 요소들이 직접 연결된 곳을 주체-관찰자 관계로 대체하면 느슨한 결합으로 개선되어 코드 재사용성을 높일 수 있음
+- 클래스를 강하게 결합하지 않고도 관련 객체들 사이의 일관성을 유지할 수 있음
+
+#### 단점
+
+- 관계를 추적하기 어려울 수 있음
+
+> 책에서는 언급하지 않았지만 메모리 누수가 발생할 수 있다는 단점도 있어요
+
+#### 예시
+
+RxJS에서는 관찰자를 만들어 특정 이벤트를 구독할 수 있음
+
+</details>
+
+<details>
+<summary>중재자 패턴</summary>
+
+## 중재자 패턴
+
+#### 정의
+
+하나의 객체가 이벤트 발생 시 여러 객체들에게 알림을 보낼 수 있는 패턴
+
+#### 특징
+
+- **중앙 집중식 통제**
+- 구성 요소 간의 관계를 관리함으로써 직접 참조 제거 → 느슨한 결합 (시스템 결합도 ↓, 재사용성 ↑)
+- 이벤트를 의사결정에 활용할 수는 있지만, fire and forget과는 거리가 있음
+- 두 개 이상의 객체가 간접적인 관계를 가지고 있고, 비즈니스 로직이나 워크플로에 따라 상호작용 및 조정이 필요한 경우에 유용
+- 퍼사드 패턴은 다른 모듈이 퍼사드의 개념을 직접적으로 인지하지 못하므로 단방향성이지만,  
+  중재자 패턴은 모듈이 명시적으로 중재자를 참조함으로써 상호작용을 중앙집중화하고 **다방향성**을 지님
+
+</details>
+
+<details>
+<summary>커맨드 패턴</summary>
+
+## 커맨드 패턴
+
+#### 정의
+
+메서드 호출, 요청 또는 작업을 단일 객체로 캡슐화하여 추후에 실행하는 패턴
+
+#### 특징
+
+- 실행 시점을 유연하게 조정하고 호출을 매개변수화
+- 명령을 실행하는 객체와 명령을 내리는 객체 간의 느슨한 결합을 통해 객체 변경에 대한 유연성을 향상시킴
+- 명령을 실행하는 객체와 명령을 내리는 객체의 책임을 분리하는 게 기본 원칙
+
+> 네이버에서 웹 기반 그래픽 편집기를 개발할 때 커맨드 패턴을 적용했다고 해요👍  
+> https://youtu.be/IaIFGYWDuuo?t=2365
+>
+> [영상에 나온 팁]
+>
+> - Command 객체의 undo, redo를 일일이 구현하지 않으려면 immutability 활용하면 된다.
+> - immer를 이용하면 상위 클래스에서 undo, redo 한 번만 구현하고 하위 클래스에서는 상속받아 쓰면 된다.
+
 </details>