[신승준] 챕터 7: 자바스크립트 디자인 패턴 (3/3)

챕터_7/신승준.md

@@ -259,3 +259,59 @@ student.study(); // any;
 > JavaScript에서 구현된 Interface 코드를 찾아봤읍니다. 무려 10년 전!
 
 [JavaScript에서 구현한 Interface](https://github.com/RestlessThinker/Javascript-Interface/blob/master/interface.js)
+
+### 플라이웨이트 패턴
+
+연관된 객체끼리 데이터를 공유하게 하면서 애플리케이션의 메모리를 최소화하는 패턴.
+
+> [디자인패턴, Flyweight Pattern, 플라이 웨이트 패턴](https://www.youtube.com/watch?v=oRThakO5o-Q) 이 영상의 예시가 조금 더 쉬워서 이해하기 수월했어요.
+
+> 매번 데이터를 생성하기 보다는, 공유될 수 있고 중복되지 않아도 되는 것들은 다른 클래스나 객체로 분리하고 이를 사용해 메모리 사용을 최소화한다.
+
+- 중앙 집중식 이벤트 핸들링
+
+여러 요소들에 하나하나 이벤트를 바인딩하기 보다는 최상위 컨테이너에 이벤트를 한 번만 바인딩한다.
+
+> 한창 자바스크립트 공부할 때 이런 방식을 자주 접하곤 했는데 막상 실무에선 써보지 않았네요. 이런 방식으로 최적화해보신 분..!?
+
+## 행위 패턴
+
+객체 간의 의사소통을 다룬다.
+
+### 관찰자 패턴
+
+한 객체가 변경될 때 이를 구독하고 있는 다른 객체들에게 변경되었음을 알린다.
+
+### 발행/구독 패턴
+
+이벤트를 발생시키는 발행자와 그 이벤트를 구독하는 구독자 사이에 토픽/이벤트 채널이 있음.
+
+발행자와 구독자를 각자 독립적으로 유지함. 그리고 느슨한 결합을 도모함.
+
+### 중재자 패턴
+
+시스템의 구성 요소들 간에 직접적인 관계가 너무 많다면, 중앙 통제 포인트를 두어 모든 구성 요소들이 이를 통해 간접적으로 소통하도록 할 때가 되었다.
+
+```typescript
+const queryClient = new QueryClient({
+  queryCache: new QueryCache({
+    onError: (error) => {
+      ...
+    },
+  }),
+});
+```
+
+> 요런 친구도 중재자 패턴이라고 할 수 있을까요? 하위 ErrorBoundary에서 걸러지지 않은 에러들은 이렇게 최상위의 query client에서 처리해주고 있는디.
+
+### 이벤트 집한 패턴과 중재자 패턴 결합하기
+
+> 세부 로직은 중재자한테 위임할건데, 그 방식은 이벤트 집한 패턴으로 하겠뜸! 정도로만 이해했읍니다...
+
+### 커맨드 패턴
+
+객체 내부의 핵심 API가 변경되면 이 API를 사용하는 모든 객체를 수정해야 한다.
+
+커맨드 패턴에서는 execute와 같은 실행을 위한 동작을 포함하는 커맨드 객체와, execute 메서드에 의해 실행할 동작을 가지고 있는 객체로 구성된다.
+
+> 근데 예시에서 CarManager의 메서드 이름만 변경되어도, 해당 메서드를 사용하고 있는 코드들도 수정해야 되지 않나요??