[박상범] 챕터 7: 자바스크립트 디자인 패턴 (3/3)

챕터_7/상범.md

@@ -232,3 +232,50 @@ const MyMixins = superclass =>
 > 플라이웨이트에 대해 잘 설명해주는 글 공유 하고 마무리 하겠습니다   
 > https://inpa.tistory.com/entry/GOF-%F0%9F%92%A0-Flyweight-%ED%8C%A8%ED%84%B4-%EC%A0%9C%EB%8C%80%EB%A1%9C-%EB%B0%B0%EC%9B%8C%EB%B3%B4%EC%9E%90
 
+# 행위 패턴
+행위 패턴은 객체 간의 의사소통을 돕는 패턴
+- 관찰자 패턴
+- 중재자 패턴
+- 커맨드 패턴
+
+## 관찰자 패턴
+- 한 객체가 변경 될 때 다른 객체들에 변경되었음을 알리는 패턴
+- 한 객체(주체)를 관찰하는 여러 객체들(관찰자)이 존재하며, 주체의 상태가 변화하면 관찰자들에게 자동으로 알림을 보낸다
+
+최신 프레임워크에서는 상태 변화를 컴포넌트에 알리기 위해 관찰자 패턴을 사용하곤 합니다
+> tearing을 방지하기 위해 나온 useSyncExternalStore가 관찰자 패턴의 예시중 하나라는게 생각났음
+
+## 발행/구독(pub/sub) 패턴
+- 구독자와 이벤트를 발생시키는 발행자 사이에 토픽/이벤트 채널을 둠
+- 핵심은 발행자와 구독자를 각각 독립적으로 유지한다는 것
+  - 시스템의 구성 요소 간에 느슨한 결합을 도모
+
+### 장점
+- 한 객체가 다른 객체들이 어떤 식으로 구현되어 있는지 생각할 필요 없이 알람을 보낼 수 있다
+  - 시스템의 구성 요소가 결합도를 낮추는 훌륭한 도구다
+
+### 단점
+- 발행자와 구독자의 연결이 분뢰됨으로써 애플리케이션 특정 부분들이 기대하는 대로 동작하고 있다는 것을 보장하기 어려워 질 수 있음
+- 구독자와 발행자 사이의 관계가 동적으로 결정되기 때문에 어떤 구독자가 어떤 발행자에 의존하는지 추적하기 어려울 수 있음
+
+## 중재자 패턴
+- 하나의 객체가 이벤트 발생 시 다른 여러 객체들에게 알림을 보낼 수 있는 패턴
+- 구성요소 간의 관계를 관리함으로써 직접 참조를 없애고 느슨한 결합을 가능하게 함
+  - 시스템의 구성 요소들 사이에 직접적인 관계가 너무 많은 것 같다? => 중앙 통제 포인트를 두어서 모든 구성 요소들이 이를 통해 간접적으로 소통하도록 할 때가 됐다는 증거
+  - 시스템 결합도 낮추고 재사용성 높임 
+- 사례로 DOM 이벤트 버블링과 이벤트 위임
+  - 개별 노드 대신 Document 객체에 이벤트 연결하고 이벤트 발생하면 객체가 개별 노드에게 알려주는 방식이니 Document는 중재자 역할임
+
+> 간단한 중재자 구현 예시를 봤는데 걍 콜백지옥 같아보였음
+
+> 여기까지 많은 예시들을 보면서 이렇게 쓰는구나 하면서 넘김
+
+> 지금까지 읽은것을 정리하면   
+> - 옵저버는 **주체-옵저버 관계로 의존성 직접적**   
+> - 발행/구독은 **이벤트 버스를 통해 느슨한 결합으로 의존성은 간접적**   
+> - 중재자는 **중재자를 중심으로 각 객체가 상호작용하는 구조고 중앙 통제형**
+
+## 커맨드 패턴
+- 명령을 내리는 객체와 명령을 실행하는 객체의 책임을 분리하는 패턴
+  - 책임을 다른 객체에 위임함으로써 역할 분리를 실현
+  - 구체적인 클래스(객체)의 변경에 대한 유연성 향상