Шта је ЈаваСцрипт МВЦ архитектура и како то функционише?



Модел-виев-цонтроллер је назив методологије за повезивање корисничког интерфејса са основним моделима података. Прочитајте да бисте разумели ЈаваСцрипт МВЦ.

У процесу развоја објектно оријентисано програмирање , модел-виев-цонтроллер (МВЦ) је методологија или образац дизајна који вам помажу у ефикасном и успешном повезивању корисничког интерфејса са основним моделима података. У овом чланку ћемо сазнати више о МВЦ архитектура у следећем низу:

ЈаваСцрипт МВЦ архитектура

У новије време, МВЦ образац се примењује на широк спектар програмских језика, укључујући . ЈаваСцрипт се састоји од одређеног броја оквира који подржавају МВЦ архитектуру или њене варијације. Омогућава програмерима да додају структуру својим апликацијама лако и без много напора.





МВЦ - ЈаваСцрипт МВЦ - едурека

МВЦ се састоји од три компоненте:



  • Модел
  • Поглед
  • Контролер

Кренимо сада и заћи у дубину ове три ЈаваСцрипт МВЦ компоненте.

је постдипломац исто као и мастер

Модели

Модели се користе за управљање подацима апликације. Они се не баве корисничким интерфејсом или слојевима презентације. Уместо тога, они представљају јединствене облике података које апликација може захтевати. Када се модел промени или ажурира, обично ће обавестити своје посматраче о промени која се догодила како би могли да поступе у складу с тим.

Узмимо пример поједностављеног модела имплементираног помоћу Бацкбоне-а:



вар Пхото = Бацкбоне.Модел.ектенд ({// Подразумевани атрибути за подразумеване поставке фотографије: {срц: 'плацехолдер.јпг', наслов: 'Подразумевана слика', прегледано: фалсе}, // Уверите се да свака створена фотографија има `срц`. иницијализуј: фунцтион () {тхис.сет ({'срц': тхис.дефаултс.срц})}})

У фотогалерији, концепт фотографије заслужио би свој модел, јер представља јединствену врсту података специфичних за домен. Такав модел може садржати повезане атрибуте као што су наслов, извор слике и додатни метаподаци. У горњем примеру, одређена фотографија би била ускладиштена у примерку модела.

Виевс

Прикази су визуелни приказ модела који пружају филтрирани приказ њиховог тренутног стања. Прикази ЈаваСцрипт користе се за изградњу и одржавање ДОМ елемента. Поглед обично посматра модел и обавештава се када се модел мења, омогућавајући погледу да се сам ажурира у складу с тим. На пример:

вар буилдПхотоВиев = фунцтион (пхотоМодел, пхотоЦонтроллер) {вар басе = доцумент.цреатеЕлемент ('див'), пхотоЕл = доцумент.цреатеЕлемент ('див') басе.аппендЦхилд (пхотоЕл) вар рендер = фунцтион () {// Користимо библиотека предложака попут Ундерсцоре // темплатинг која генерише ХТМЛ за наш // унос фотографије пхотоЕл.иннерХТМЛ = _.темплате ('#пхотоТемплате', {срц: пхотоМодел.гетСрц ()})} пхотоМодел.аддСубсцрибер (рендер) пхотоЕл. аддЕвентЛистенер ('цлицк', фунцтион () {пхотоЦонтроллер.хандлеЕвент ('цлицк', пхотоМодел)}) вар схов = фунцтион () {пхотоЕл.стиле.дисплаи = ''} вар хиде = фунцтион () {пхотоЕл.стиле.дисплаи = 'ноне'} ретурн {сховВиев: схов, хидеВиев: хиде}}

Предност ове архитектуре је у томе што свака компонента игра своју засебну улогу у стварању функције апликације по потреби.

како претворити низ у датум у Јава

Контролери

Контролори се понашају као посредници између модела и погледа, који су одговорни за ажурирање модела када корисник манипулише приказом. У горњем примеру наше апликације са фото галеријом, контролер ће бити одговоран за обраду промена које је корисник унео у приказ за уређивање одређене фотографије, ажурирајући одређени модел фотографије када корисник заврши са уређивањем.

шта је формат у питхон-у
вар ПхотосЦонтроллер = Спине.Цонтроллер.суб ({инит: фунцтион () {тхис.итем.бинд ('упдате', тхис.проки (тхис.рендер)) тхис.итем.бинд ('уништи', тхис.проки (овај .ремове))}, рендер: фунцтион () {// Руковање предлошком тхис.реплаце ($ ('#пхотоТемплате') .тмпл (тхис.итем)) ретурн тхис}, уклањање: фунцтион () {тхис.ел.ремове () тхис.релеасе ()}})

Овај пример ће вам пружити врло лаган и једноставан начин управљања променама између модела и приказа.

ЈаваСцрипт МВЦ Фрамеворкс

У последњих неколико година, серија ЈаваСцрипт МВЦ су развијени. Сваки од ових оквира следи неки облик МВЦ обрасца са циљем да подстакне програмере да напишу структуриранији ЈаваСцрипт код. Неки од оквира су:

  • окосница.јс
  • Ембер.јс
  • АнгуларЈС
  • Сенцха
  • Кендо УИ

Овим смо дошли до краја ЈаваСцрипт МВЦ чланка. Надам се да сте разумели три компоненте укључене у МВЦ архитектуру.

Сада када знате за ЈаваСцрипт МВЦ, погледајте Едурека. Обука за сертификацију за веб развој ће вам помоћи да научите како да креирате импресивне веб локације користећи ХТМЛ5, ЦСС3, Твиттер Боотстрап 3, јКуери и Гоогле АПИ-је и примените их на Амазон Симпле Стораге Сервице (С3).

Имате питање за нас? Молимо вас да га спомињете у одељку за коментаре „ЈаваСцрипт МВЦ“ и јавићемо вам се.