[JavaScript] 디자인 패턴 정리

디자인 패턴이란?

소프트웨어 설계의 주어진 콘텍스트 내에서 일반적으로 발생하는 문제에 대한 일반적이고 재사용 가능한 솔루션입니다.
소스나 기계어로 직접 변환할 수 있는 완성된 디자인이 아닙니다.
오히려 다양한 상황에서 사용할 수 있는 문제를 해결하는 방법에 대한 설명 또는 템플릿입니다.
디자인 패턴은 프로그래머가 응용 프로그램이나 시스템을 디자인할 때 일반적인 문제를 해결하는 데

사용할 수 있는 공식화된 모범 사례입니다.

---

장점

• 최고의 솔루션: 디자인 패턴은 여러번 수정 하면서 완성되었기 때문에 디자인 패턴은 이미 잘 작동한다는 것을 알고 있습니다. 그래서 대부분의 개발자가 자주 사용합니다.
• 재사용성: 디자인 패턴은 단일 문제에만 존재할 수 없으므로 여러 문제를 해결하기 위해 특정 상황에서 수정할 수 있는 재사용 가능한 솔루션을 나타냅니다.
• 풍부한 표현력: 디자인 패턴은 큰 문제를 부분적으로 효율적으로 설명할 수 있기 때문에 더 이상의 설명이 필요하지 않습니다.
• 향상된 의사 소통: 디자인 패턴에 익숙한 개발자는 문제에 대한 공통 목표를 설정하여 잠재적인 문제와 이러한 문제에 대한 솔루션에 대해 서로 의사 소통하는 데 도움이 됩니다.
• 필요없는 코드 리팩토링: 디자인 패턴은 종종 다양한 문제에 대한 최적의 솔루션으로 불립니다. 디자인 패턴을 염두에 두고 응용 프로그램을 작성하는 경우 생성된 솔루션이 효율적인 솔루션이므로 코드 리팩토링이 필요하지 않다고 가정합니다.
• 코드베이스 크기 감소: 유일한 최적의 솔루션인 디자인 패턴은 공간을 거의 차지하지 않고 몇 줄의 코드로 필요한 솔루션을 구현하여 소중한 공간을 보존합니다.
•  

---

Singleton Pattern

Singleton 패턴은 클래스의 인스턴스화를 하나의 객체로 제한하는 디자인 패턴입니다.

이는 시스템 전체에서 작업을 조정하는 데 정확히 하나의 객체가 필요한 경우에 유용합니다.

 

예시

예를 들어 여러 사용자가 볼륨을 제어할 수 있는 TV가 있다고 해봅시다.

사용자는 각 리모컨을 가지고 볼륨을 제어할 수 있습니다. 그런데 사용자1이 볼륨을 10으로 올리면 TV에서는 볼륨 10 값을 전역으로 설정해놓고, 다른 사용자가 볼륨을 수정하게 되면 10부터 시작하게 됩니다. 이런 경우 싱글톤이 적용되었다고 볼 수 있습니다.

만약에 각 사용자에게 각각의 볼륨이 지정되어있다면 문제가 발생하겠죠.

---

아래 코드는 Counter 객체를 정의하고 counter 값을 조절하는 예제입니다.

생성자를 통해 instance는 한번 생성되고, 이후에 한번 더 생성자를 호출하면 오류를 throwing 합니다.

 

이미 생성된 singletonA객체에 대해서 .increment()를 두번 호출해도 문제가 없지만,

singletonB객체를 새로 생성한다면 오류가 발생할 것입니다.

 

예시 코드

---

Factory Pattern

팩토리 패턴을 사용하면 특수 함수인 팩토리 함수를 사용하여 비슷한 객체를 많이 만들 수 있습니다.

-> 비슷한 객체를 반복적으로 생성해야하는 경우 사용

---

예시

 

> 보통 객체를 생성하는 방법

 

위의 문제점을 해결하기 위해 팩토리 패턴을 이용한 객체 생성

---

정리

팩토리 패턴은 동일한 코드를 계속해서 반복할 필요 없이 동일한 속성을 공유하는 여러 객체를 만들어야 할 때 유용합니다.

Factory 기능은 현재 환경 또는 사용자별 구성에 따라 사용자 지정 객체를 쉽게 반환할 수 있습니다.

 

---

Mediator Pattern(중재자 패턴)

중재자 패턴은 객체 그룹에 대한 중앙 권한을 제공합니다. 
이 패턴은 채팅방을 예로 들어서 설명해보겠습니다.

채팅방(중재자)에 들어와서 채팅 세션에 참여하는 3명의 참가자가 있습니다.
각 참가자는 Participant 객체로 표시됩니다.
참가자는 서로에게 메시지를 보내고 채팅방에서 라우팅을 처리합니다.
(먼저 Mediator가 채팅을 받은 후에 라우팅으로 채팅을 전달합니다.)
메시지를 다이렉트로 보내는 것이 아닌 중재자를 거쳐서 메세지가 전달됩니다.

 

이렇게 하므로 정크 메시지를 받지 않도록 참가자를 보호하기 위해 '정크 필터'와 같은 다른 복잡한 규칙을 추가할 수 있습니다.

 

---

State Pattern (상태 패턴)

• 상태 패턴은 각 객체가 특정 상태를 나타내는 제한된 객체 집합에 상태별 논리를 제공합니다.
• 상태 패턴은 객체의 내부 상태에 따라 스스로 행동을 변경할 수 있게 허가하는 패턴입니다.
• 이렇게 해서 객체는 마치 자기 자신의 클래스를 바꾸는 것 처럼 보이게 됩니다.

 

 

---

Module Pattern

코드를 더 작고 재사용 가능한 조각으로 분할하는 것을 도와줍니다.

ES2015는 내장 JavaScript 모듈을 도입했습니다.
모듈은 JavaScript 코드가 포함된 파일이며 특정 값을 쉽게 노출하고 숨길 수 있도록 합니다.

모듈 패턴은 더 큰 파일을 여러 개의 더 작고 재사용 가능한 조각으로 분할하는 좋은 방법입니다.

또한 모듈 내의 값은 기본적으로 모듈 내에서 비공개로 유지되고 수정할 수 없기 때문에 코드 캡슐화를 촉진합니다.
export 키워드를 사용하여 명시적으로 내보낸 값만 다른 파일에서 액세스할 수 있습니다.