Sobes.tech
Middle

Čo je to architektonický vzor MVP?

sobes.tech AI

Odpoveď od AI

MVP (Model-View-Presenter) je architektonický vzor na oddelenie podnikovej logiky, dát a používateľského rozhrania.

Kľúčové komponenty:

  • Model: Reprezentuje dáta a podnikovú logiku. Nemá znalosti o View alebo Presenter.
  • View: Zobrazuje dáta, poskytuje používateľské rozhranie a presmerováva akcie používateľa na Presenter. Neobsahuje podnikovú logiku. View je pasívne a iba zobrazuje dáta prijaté od Presenter.
  • Presenter: Pôsobí ako sprostredkovateľ medzi Modelom a View. Spracováva udalosti používateľského rozhrania, získava dáta z Modelu a aktualizuje View. Obsahuje logiku prezentácie, ale nie podnikovú logiku. Riadi stav View.

Interakcia:

  1. Používateľ interaguje s View.
  2. View deleguje akciu na Presenter.
  3. Presenter spracováva akciu:
    • Aktualizuje Model, ak je to potrebné.
    • Vyžaduje dáta z Modelu.
    • Aktualizuje View s novými dátami.

Výhody:

  • Zlepšená testovateľnosť (Presenter a Model môžu byť testované nezávisle od View).
  • Rozdelenie zodpovedností.
  • Lepšia údržba.

Príklad (schéma):

// Model
class DataModel {
    getData() {
        // ... logika na získanie dát ...
        return { message: "Ahoj z modelu!" };
    }
}

// Pohľad (pseudokód UI)
class TextView {
    display(data) {
        // Aktualizovať text na obrazovke
        console.log(data.message);
    }

    onClickButton(handler) {
        // Pripojiť obsluhu na tlačidlo
    }
}

// Presenter
class Presenter {
    constructor(model, view) {
        this.model = model;
        this.view = view;
        this.view.onClickButton(this.handleButtonClick.bind(this)); // Väzba udalosti
    }

    handleButtonClick() {
        const data = this.model.getData();
        this.view.display(data);
    }
}

// Použitie
const model = new DataModel();
const view = new TextView(); // Reálne UI
const presenter = new Presenter(model, view);