[디자인 패턴] MVC, MVP, MVVM

디자인 패턴이란?

SW를 개발할 때의 문제점들을 개선하기 위해, SW의 구조와 규약을 정리하여 패턴처럼 쉽게 사용할 수 있도록 정리된 방법을 의미한다.

 

1. MVC(Model + View + Controller) 패턴이란?

MVC 패턴을 사용하는 목적은 View와 Model사이에 Controller를 두어 View와 Model의 의존성을 없애기 위함입니다.

 

1.1 구조

• Model : 어플리케이션에서 사용되는 데이터와 그 데이터를 처리하는 부분
• View : 사용자에게 보여지는 UI부분
• Controller : 사용자의 입력(Action)을 받고 처리하는 부분

1.2. 동작(***)

1) 사용자의 Action들은 Controller가 감지 한다.

2) Controller : 사용자의 Action을 확인하고, Model을 업데이트 한다.

3) Controller :  Model을 나타내줄 View를 선택한다.

4) View :  Model을 이용하여 화면을 나타낸다.

MVC에서 View가 업데이트 되는 대표 3가지 방법

• View가 Model을 이용하여 직접 업데이트 하는 방법
• Model이 View에게 Notify해줘서 업데이트 하는 방법
• View가 Polling을이용해 주기적으로 Model의 변경을 감지하여 업데이트 하는 방법

 

polling 이란?

하나의 장치(또는 프로그램)가 충돌 회피 또는 동기화 처리 등을 목적으로 다른 장치 의 상태를 주기적으로 검사하여 일정한 조건을 만족할 때 송수신 등의 자료처리를 하는 방식

1.3. 특징

• C는 여러개의 V를 선택할수 있다.
• C는 V를 직접 업데이트 하진 않는다 (서로 안친하다)

1.4. 장점

• 널리 사용되고 있는 패턴
• 가장 단순하다
• 보편적으로 많이 사용 (View와 Model사이의 의존성이 높다)

1.5 단점

• 어플리케이션이 커질수록 복합해지고 유지보수가 어려워 진다.
  • Model만 바꾸려고 했는데, View도 전부 Model에 맞게 바꾸어주어야 한다.

2. MVP(Model + View + Presenter) 패턴이란?

View에서 Model의 의존성을 제거하기 위해 MVC패턴이 고안되었으나, 실제로는 MVC는 View에서 Model을 이용하기 때문 View와 Model은 의존적입니다.

즉, Model이 업데이트 되면 View도 업데이트가 됩니다.

따라서 View와 Model의 의존성을 완벽하기 분리하기 위한 새로운 패턴이 등장했습니다.

MVP 모델은 MVC 모델의 Controller가 Presenter로 바뀐 것입니다.

Preseneter는 View의 인스턴스를 갖고 있으며 View에서 요청이 발생하면 이벤트에 따른 Model의 상태를 변경시킵니다.

즉, 철저하게 View와 Model를 분리시키고, View와 Model 사이에 다리 역할을 수행합니다.

MVC 패턴에서는 사용자 입력(Action)이 Controller로부터 왔습니다.

그러나 MVP 패턴은 사용자 입력(Action)이 View에서 발생합니다.

 

MVC 패턴을 가진 대부분의 프레임워크에서 URL 요청을 받은 라우터는 컨트롤러로 연결됩니다.
그러나 MVP 패턴은

View에서 요청이 발생하면 Presenter로 전달하고 

Presenter에서는 그 이벤트에 따른 Model의 상태를 업데이트 시킵니다.

Model이 업데이트 되면 Presenter에서는 그 결과를 다시 View에 전달하는 것이죠.

따라서 MVP 패턴은 View와 Model 간의 의존성을 분리시켰습니다.
       

2.1. 구조

• Model : 어플리케이션에서 사용되는 데이터와 그 데이터를 처리하는 부분
• View : 사용자에게 보여지는 UI부분
• Presenter : View에서 요청한 정보로 Model을 가공하여 View에 전달해준다. View와 Model에게 꼭 필요한 존재이다.

 

2.2. 동작(***)

1) 사용자의 Action들은 View를 통해 들어온다.

2) View : 데이터를 Presenter에 요청합니다.

3) Presenter : Model에게 데이터를 요청.

4) Model :  Presenter에서 요청받은 데이터를 응답.

5) Presenter :  View에게 데이터를 응답합니다.

6) View : Presenter가 응답한 데이터를 이용하여 화면을 나타냅니다.

2.3. 특징

P는 V,M의 인스턴스를 가지고 있어 둘을 연결하는 역할을 한다. P와 V는 1:1관계이다.

 

2.4. 장점

• View와 Model의 의존성이 없다.

( Presenter를 통해서만 데이터를 전달 받기 때문) 

 

2.5 단점

• View와 Presenter사이의 의존성이 높아졌다.
• 어플리케이션이 복잡해질수록 View와 Presenter사이의 의존성이 강해진다.
  • View만 바꾸려고 했는데, import 되어 있는 Presenter도 바꾸어주어야 한다.

3. MVVM (Model + View + View Model) 패턴이란?

MVP 패턴은 View와 Model 간의 의존성을 분리시켰습니다.

그러나 View와 Presenter의 관계는 1 : 1이기 때문에 Presenter는 View와 의존성이 깊다고 할 수 있습니다.

 

MVP패턴 역시 View와 Presenter간의 의존성이 깊기 때문에 이 문제를 해결하려 새로운 패턴이 등장합니다.

MVVM 모델은 MVC 모델의 Controller , MVP 모델의 Presenter 대신 ViewModel로 바뀐 모델입니다.

 

ViewModel은 View를 나타내기 위한 Model이라 이해하시면 됩니다.

MVVM 모델은 MVP 모델과 같이 View에서 입력이 들어옵니다.

 

View에서 입력이 들어오면 Command 패턴을 통해 ViewModel에 명령을 내리게 되고 ViewModel은 Model에게 필요한 데이터를 요청합니다.

Model은 ViewModel에 필요한 데이터를 응답하고 (여기까지는 Presenter와 동일한 것처럼 보인다.)

Data Binding을 통해 ViewModel의 값이 변화하면 바로 View의 정보가 바뀌게 됩니다.
(Presenter가 응답에 따라 View를 바꾸어주는 추가적인 작업이 자동화된 것처럼 보인다.)

즉, Command와 Data Binding을 통해 View의 의존성을 끊어버렸습니다.

이로써 View와 Model의 분리가 이루어졌고, MVP 패턴의 문제점을 해결되었습니다.

 

3.1. 구조

• Model : 어플리케이션에서 사용되는 데이터와 그 데이터를 처리하는 부분.
• View : 사용자에서 보여지는 UI 부분.
• View Model : View를 표현하기 위해 만든 View를 위한 Model이다. View를 나타내 주기 위한 Model이자 View를 나타내기 위한 데이터 처리를 하는 부분.

 

3.2. 동작

1) 사용자의 Action들은 View를 통해 들어온다

2) View에 Action이 들어오면, Command 패턴으로 View Model에 Action을 전달

3) View Model : Model에게 데이터를 요청합니다.

4) Model : View Model에게 요청받은 데이터를 응답

5) View Model : 응답 받은 데이터를 가공하여 저장.

6) View : View Model과 Data Binding하여 화면을 나타낸다.

 

3.3. 특징

• Command 패턴과 Data Binding 두 가지 패턴을 사용하여 구현되었다.
• Command 패턴과 Data Binding을 이용하여 View와 View Model 사이의 의존성을 없앴다.
• VM과 V는 1:n 관계이다.

 

3.4. 장점

- View와 Model사이의 의존성이 없다.

- Command패턴과 Data Binding을 사용하여 View와 View Model사이의 의존성 또한 없앤 디자인 패턴이다

- 각각의 부분은 독립적이기 때문에 모듈화 하여 개발할 수 있다.

 

3.5 단점

- View Model의 설계가 쉽지 않다.