디자인 패턴(2)

이터레이터 패턴

- 이터레이터를 사용하여 컬렉션의 요소들에 접근하는 디자인 패턴이다.

- 이터레이터라는 하나의 인터페이스로 순회가 가능하다.

 

ex) javascript로 바라본 이터레이터 패턴

: set과 map은 다른 자료구조임에도 for a of b라는 이터레이터 프로토콜을 통해 순회가 가능하다.

const mp = new Map()
mp.set('a', 1)
mp.set('b', 2)
mp.set('c', 3)

const st = new Set()
st.add(1)
st.add(2)
st.add(3)

for (let a of mp) console.log(a)
for (let a of st) console.log(a)

---

노출모듈 패턴

- 즉시 실행 함수를 통해 private, public 같은 접근 제어자를 만드는 패턴이다.

- 전역 범위에서 스크립트가 실행되고, 이 패턴을 통해 private와 public 접근 제어자를 구현하기도 한다.

public

- 클래스에 정의된 함수에서 접근 가능하며 자식 클래스와 외부 클래스에서 접근 가능한 범위

private

- 클래스에 정의된 함수에서 접근 가능하지만 자식 클래스와 외부 클래스에서 접근 불가능한 범위

protected

- 클래스에 정의된 함수에서 접근 가능, 자식 클래스에서 접근 가능하지만 외부 클래스에서 접근 불가능한 범위

즉시 실행 함수

- 함수를 정의하자마자 바로 호출하는 함수. 초기화 코드, 라이브러리 내 전역 변수의 충돌 방지 등에 사용

---

MVC 패턴

- 모델, 뷰, 컨트롤러로 이루어진 디자인 패턴이다.

- 애플리케이션의 구성 요소를 세 가지 역할로 구분하여 개발 프로세스에서 각각의 구성 요소에만 집중해서 개발할 수 있다.

- 재사용성과 확장성이 용이하다.

- 복잡해질수록 모델과 뷰의 관계가 복잡해진다.

- 가장 대표적인 프레임워크 : Spring(자바 플랫폼을 위한 오픈 소스 애플리케이션)

 

- 모델(Model)

    1. 애플리케이션의 데이터인 데이터베이스, 상수, 변수 등을 뜻한다.

    2. View에서 데이터를 생성하거나 수정하면 >> Controller를 통해 Model을 생성하거나 갱신한다.

 

- 뷰(View)

    1. inputbox, checkbox. textarea 등 사용자 인터페이스 요소를 나타낸다.

    2. 간단하게 생각하면 사용자가 보는 화면을 뜻한다.

    3. 화면에 표시하는 정보만 가지고 있어야 한다.

 

- 컨트롤러(Controller)

    1. 하나 이상의 Model과 하나 이상의 View를 잇는 다리역할을 한다.

    2. 이벤트 등 메인 로직을 담당한다.

    3. Model, View의 생명주기도 관리한다.

    4. 만약 변경사항을 받으면 이를 각각의 구성 요소에 해당 내용에 대해서 알려주는 역할을 한다.

---

MVP 패턴

- MVC로부터 파생되었고, C >> P(Presenter)로 교체된 패턴이다.

- View와 Presenter는 1:1 관계이기에 MVC보다 더 강한 결합을 지닌 디자인 패턴이라고 볼 수 있다.

---

MVVM 패턴

- MVC에서 C >> VM(View Model)로 바뀐 패턴이다.

- 커맨드와 데이터 바인딩을 가진다.

- View <ㅡ> View Model 사이의 양방향 데이터 바인딩을 지원

    ㅡ> UI를 코드 수정 없이 재사용 가능하고 단위 테스팅 하기 쉽다.

- 가장 대표적인 프레임워크 : View.js

    - 함수를 사용하지 않고 값 대입만으로도 변수가 변경되며 양방향 바인딩, html을 토대로 컴포넌트를 구축할 수 있는 특징이 있다.