Pradėkite nuo „Knockout.js“

Sunkiausios programos dalies perkėlimas į kliento pusę tampa vis dažnesnis, todėl serverių kalbos perkeliamos tik į tas, kurios tvarko paslaugas POILSIS.
Dalis atsakomybės, kad visa tai įvyktų, tenka naujiems darbo būdams „JavaScript“ ir dinamiškų bei reaguojančių vartotojo sąsajų generavimas dėl skirtingų rėmus esamas.
Ši sistema turi daug privalumų, tokių kaip mažas svoris ir dokumentai, taip pat tai, kad ji buvo rinkoje jau seniai, todėl ji nuolat brandinama, kad ją būtų galima naudoti gamybos aplinkoje.
1- Kaip ir dauguma bibliotekų bei jų struktūrų „JavaScript“ reikalavimai nėra tokie reiklūs, šiuo atveju mums reikės nedidelio žiniatinklio serverio, kad geriau apdorotume užklausas Wamp į „Windows“ arba pavyzdys Apache į Linux arba „Mac“.
2- Mums reikia tokio stiliaus turtingo teksto redaktoriaus Aukščiausias tekstas arba NotePad ++ kad galėtume parašyti reikiamą kodą, kad įvykdytume pavyzdžius ir pratimus, kuriuos parodysime.
3- Galiausiai mums reikia interneto prieigos, kad galėtume atsisiųsti Knockout.js net kartą.
Diegimo procesas yra gana paprastas ir nepriklauso nuo konkrečios platformos, procesas bus tas pats, nesvarbu, ar esame „Windows“, „Linux“ arba MAC.
Pirmas dalykas, kurį turime padaryti, yra atsisiųsti Knockout.js iš jo oficialaus puslapio, tam galime eiti į projekto svetainę ir parsisiuntimai dešiniuoju pelės mygtuku spustelėkite ir pasirinkite parinktį Išsaugoti nuorodą kaip:

DIDELIS

Svarbu išsaugoti failą aplanke, susijusiame su mūsų projektu, kad jį būtų galima įtraukti. Jis taip pat gali būti įdiegtas naudojant Bower ar net naudoti ją iš bet kurios CDN paslaugas, kad nereikėtų naudoti mūsų serverio kaip bibliotekos saugyklos.
Gavę failą, mes tiesiog turime jį įtraukti į failą HTML taip:

 „Knockout.js“ diegimas 

Kaip matome, atsisiųstą failą turėjome įtraukti tik per scenarijaus žymą. Jei norime dirbti su CDN Mums tereikia pakeisti vietinį kelią į failo interneto kelią, tai labai panašu į darbą su bibliotekomis, pvz. „jQuery“ ar tokias sistemas kaip KampinisJS.
Modelis Rodinys Peržiūrėti modelįŠio skyriaus pavadinimas gali atrodyti kaip klaida. Kaip galima kalbėti apie modelio peržiūros modelį? Ar tai ne tas pats? Pasirodo, kad Nokautas turi dizaino modelį ar kūrimo paradigmą, iš kurios jis yra įkvėptas MVC, kur tikrai Modelis ir Peržiūrėti jie elgiasi taip, kaip žinome iš „klasikinio“ požiūrio, tačiau turime naują sluoksnį, vadinamą „ViewModel“ kuri yra atsakinga už mūsų pažiūrų sujungimą ir funkcionalumo suteikimą.
Duomenų įrišimas yra pagrindinė mūsų sistemos ypatybė, leidžianti nurodyti dokumentui HTML prie kurių elementų turite suteikti prieigą Knockout.js, nors tai skamba kaip kažkas sudėtingo, galime tai apibendrinti kaip ką nors paprastesnio, tai yra paprastas savybių pritaikymas medžio elementams SAULĖ ten, kur mes norime, kad jis veiktų Knockout.js.
Pažiūrėkime šį kodo pavyzdį, tarkime, kad norime atspausdinti vardą iš savo „ViewModel“ ant etiketės viduje kūnas, tam turime atlikti tik šiuos veiksmus:

 „Knockout.js“ diegimas 

Tai matome savo etiketėje h1 yra apytikslė žyma, o ribos žyma turi savybę, kuri nėra gimtoji HTML kas yra turtas susieti duomenis, tai mus verčia prisijungti Knockout.js su mūsų DOM medis šiuo atveju mes tiesiog nurodėme, kad ypatybės ar kintamojo pavadinimas turėtų būti paimtas iš mūsų „ViewModel“.
Jei vykdysime savo pavyzdį naršyklėje, gausime tokį rezultatą, kokį matome šiame paveikslėlyje:

Su tuo mes jau sukūrėme pirmąją programą naudodami Knockout.js.
Iki šiol mes turėjome suvokti tą filosofiją „ViewModel“ yra svarbi darbo dalis Knockout.js, todėl mes ir toliau gilinsimės šia tema.
„VistaModel“ kūrimasYra du modelio rodinio kūrimo būdai: pagrindinė forma ir į objektą orientuota, kurią naudojame, jau priklauso nuo to, kaip kuriame, nors rekomenduojama orientuotas į objektą nes nors iš pradžių ji yra sudėtingesnė, ji leidžia mums pasiekti geresnę tvarką mūsų programoje.
Norėdami sukurti a „ViewModel“ iš esmės mes turime padaryti kažką panašaus:

 var myModelView = {pavadinimas: 'Pedro Perez'};

Kaip matome, jis nėra sudėtingas, mes tiesiog apibrėžiame kintamąjį ir į jį įtraukiame stiliaus turinį. JSONAS.
Dabar kelias orientuotas į objektą leidžia mums sukurti būdus, kaip pasiekti ir manipuliuoti savybėmis, kurias norime įtraukti į savo „ViewModel“, tam galime padaryti kažką panašaus:

 var myOOOOOOFModelView = funkcija () {var self = this; self.name = 'Džonatanas'; self.lastname = 'Acosta'; self.getName = function () {return self.name + '' + self.last name; };};

Jei norime, tokiu atveju galime tiesiogiai pasiekti vardą ar pavardę arba naudoti šį metodą getName () tai suteikia mums vardą ir pavardę, sujungtus arba sujungtus.
Čia daugeliui gali kilti klausimas, ar nebuvo lengviau padaryti solo Styga Naudojant vardą ir pavardę, atsakymas yra labai paprastas, kuo daugiau galimybių turime, tuo paprastesnė bus mūsų nuomone programa, įsivaizduokite, kad norėjome tik vardo, o pagrindine forma turėtume apdoroti eilutę sugebėdami juos atskirti, į objektą orientuotuose pokyčiuose pasiekiame tik mus dominančią nuosavybę.
Kol kas tai, ką matėme, yra labai statiška, o kas, jei dabar pradėtume naudoti parametrus, tokiu būdu a „ViewModel“ Tai gali pasitarnauti daugeliui tikslų, nes neapsiribosime tuo, ką nustatome, bet galime keisti duomenis pagal situaciją.
Perrašykime savo formą orientuotas į objektą, ir mes naudosime šią formą:

 var myOOOOOOOFModelView = funkcija (vardas, pavardė) {var self = this; save.pavadinimas = vardas; save.pavardė = pavardė; self.getName = function () {return self.name + '' + self.last name; };};

Kaip matėme, buvo labai lengva įdiegti parametrų naudojimą, dabar tai įgyvendinsime pirmajame pavyzdyje ir taip pamatysime, kaip viskas dera į savo vietas, tam naudosime šį HTML kodą:

 „Knockout.js“ diegimas 

Čia pirmas dalykas, kurį pastebime, yra tas, kad susieti duomenis tai jau nebėra tekstas kaip ir pradiniame pavyzdyje, jei ne, mes naudojame html, tai leidžia mums siųsti etiketes html ir taip galėtume suteikti daugiau stiliaus mūsų atsakymui iš „ViewModel“.
Jau skyriuje, kuriame mes apibrėžiame savo „ViewModel“ matome, kad prieš taikydami privalomas apie Knockout.js, mes kuriame savo „ViewModel“ pavyzdį orientuotas į objektą, Būtent šiuo metu mes galime suteikti reikšmes savo parametrams ar savybėms, kaip matome, kad atskiriame vardą ir pavardę, bet galiausiai galime naudoti juos sujungiančius metodus.
Kai vykdome savo pavyzdį, naršyklėje gaunami šie rezultatai:

Bus įdomu, ką ši sistema turi, ko ji dar nesiūlo KampinisJS arba Backbone.jsir jie yra teisūs klausinėdami, tačiau mes jiems atsakome, kad tai tik dar viena galimybė, kurią jie gali turėti, ji turi savo stipriąsias puses, pavyzdžiui, gerą dokumentaciją ir nedidelį jos įgyvendinimo svorį (tik apie 20 kb), Bet, kaip ir viskas, kiekvienas gali laisvai pasirinkti priemonę, leidžiančią pasiekti savo tikslus ir geriausiai atitinkančią dabartinius reikalavimus.
Baigę pamoką, sėkmingai žengėme pirmuosius žingsnius Knockout.js, todėl galime pradėti galvoti apie visas galimybes, kurias mums siūlo ši programų kūrimo sistema su kliento logika.