Getur einhver fyrir byrjendur skýrt muninn á þjónustu, verksmiðju og þjónustuaðila í AngularJS?


svara 1:

AngularJS: munur á þjónustu og þjónustuaðila og verksmiðju

Ef þú ert að leita að því er það líklega vegna þess að þú vilt komast að því hver hentar þér. Eða vegna þess að þú rakst á þrjá og ert að reyna að segja frá mismuninum vegna þess að þeir virðast svipaðir.

Ef þú heldur að þeir séu svipaðir, þá hefur þú rétt fyrir þér. Þeir eru mjög líkir. Reyndar eru þeir allir eins.

Þeir eru allir veitendur. Verksmiðjan og þjónustan eru aðeins sérstök tilvik veitunnar, en þú getur náð öllu því sem þú vilt með því að nota aðeins veituna. Ég mun sýna þér.

Veitandinn

Við munum búa til þjónustuaðila sem skilar gildi og birtir einfaldlega það gildi. Þú myndir gera þetta:

var mod = angle.module ("MyModule", []); mod.provider ("myProvider", fall () {þetta. $ get = function () {return "My Value";};}); mod.controller ("MyController", fall (myProvider) {console.log ("MyController - myProvider:" + myProvider);}); CONSOLE útgáfa MyController - myProvider: gildi mitt

Vinnandi gagnvirkt dæmi er að finna á: JS Fiddle.

Þar geturðu „veitt“ gildi með „veitanda“ í kjarna þess. Þetta gildi gæti verið hvað sem er. Í þessu tilfelli er það strengur með gildið "My value", en það getur auðveldlega verið fall eða hlutur.

Í öðrum kóða kóða, athugaðu að ég mun útiloka merki og skilgreiningu á unga fólkinu til að fá kóðabitana stutta og að marki.

Hyrndur fær gildi aðeins einu sinni

Athugið að Hyrndur „fær“ gildi aðeins einu sinni, óháð því hversu oft sprautað er í veituna. Það er, það kallar $ get () aðeins einu sinni, geymir gildi sem $ get () veitir og gefur þér sama geymda gildi í hvert skipti.

Til að sýna þér hvað ég meina, mun ég búa til annan stjórnanda og bæta við annarri stjórnborðsleiðbeiningunni til veitunnar svo þú getir séð hvað gerist.

mod.provider ("myProvider", fall () {þetta. $ get = fall () {console.log ("MyProviderFunction. $ get () kallað."); // ADDED this line return "My Value";}; }); mod.controller ("MyController", fall (myProvider) {console.log ("MyController - myProvider:" + myProvider);}); mod.controller ("MyController2", fall (myProvider) {// ADDED this controller console.log ("MyController2 - myProvider:" + myProvider);}); CONSOLE OUTPUT MyProviderFunction. $ Fá () er kallað. MyController - myProvider: gildi mitt MyController2 - myProvider: gildi mitt

Opið í JS Fiddle

Eins og þú sérð var $ get () aðgerðin aðeins kölluð einu sinni.

Athugaðu að við skrifuðum fullt af kóða fyrir veituna bara til að búa til aðferð sem kallast $ get (). Af hverju ekki, í stað þess að gefa hyrndaraðgerð sem skilgreinir aðra aðgerð, af hverju ekki bara að gefa þá aðgerð sem við viljum framkvæma beint í staðinn? Jæja, Angular getur kallað það verksmiðju.

Verksmiðja

Í verksmiðju veitir þú líkamanum fyrir $ get aðferðina og Angular gerir það sem eftir er. Hér er hvernig nýja kóðinn lítur út, þar sem þú munt sjá að það gerir það sama.

mod.factory ("myProvider", fall () {// "veitandi" breytt í "verksmiðju" console.log ("Verksmiðjuaðgerð kallað."); skila "Gildi mínu";}); mod.controller ("MyController", fall (myProvider) {console.log ("MyController - myProvider:" + myProvider);}); mod.controller ("MyController2", fall (myProvider) {console.log ("MyController2 - myProvider:" + myProvider);}); CONSOLE EXIT Verksmiðjuaðgerð kallað. MyController - myProvider: gildi mitt MyController2 - myProvider: gildi mitt

Opið í JS Fiddle

Nú kanntu að velta fyrir þér af hverju þú ættir einhvern tíma að nota þjónustuaðila ef þú getur gert það sama með verksmiðju með minni kóða. Það eru nokkrar ástæður sem ég mun fjalla um síðar. Eins og er vil ég halda fast við titil þessarar færslu og taka á mismuninum á milli þessara tveggja (seljanda og verksmiðju) og þjónustu.

Hingað til höfum við skilað einföldu strengagildi, en í reynd viljum við líklega skila hlut mestum tíma. Jæja, það myndi ekki breyta fordæmi okkar mjög mikið. Við getum auðveldlega skipt um streng sem við skilum fyrir hlut.

Við skulum til dæmis gera þetta með því að skila hlut sem inniheldur aðgerð sem kallast getValue (). Nú eru nokkrar leiðir til að búa til hlut í JavaScript. Við notum nálgun framkvæmdaaðila, þar sem við búum til aðgerð sem byggir hlut með eiginleika og aðgerðir og notum nýja lykilorðið til að koma honum á framfæri.

Virka MyObject () {// ADDED object constructor this.getValue = function () {return "My Value"; }; } mod.factory ("myProvider", fall () {console.log ("Verksmiðjuaðgerð kallað."); skila nýju MyObject (); // CREATE dæmi af hlut okkar}); mod.controller ("MyController", virka (myProvider) {console.log ("MyController - myProvider:" + myProvider.getValue ()); // BREYTT til að hringja í getValue ()}); mod.controller ("MyController2", fall (myProvider) {console.log ("MyController2 - myProvider:" + myProvider.getValue ()); // BREYTAÐ að hringja getValue ()}); CONSOLE EXIT Verksmiðjuaðgerð kallað. MyController - myProvider: gildi mitt MyController2 - myProvider: gildi mitt

Opið í JS Fiddle

Nú vil ég gera smá breytingu á því þar sem þetta mun leiða vel að næsta hugtaki. Í dæminu okkar búum við til aðgerðina „Object Constructor“ MyObject (). Hins vegar getum við notað nafnlausa aðgerð í staðinn þar sem við tökum aðeins upp þau á einum stað.

Þetta er mjög lítil breyting. Í staðinn fyrir:

Aðgerð MyObject () {this.getValue = fall () {skila „Gildi mínu“; }; } mod.factory ("myProvider", fall () {console.log ("Verksmiðjuaðgerð kallað."); skila nýju MyObject ();});

Við gerum það:

mod.factory ("myProvider", function () {console.log ("Factory function called."); return new function () {// INLINED object constructor our.getValue = function () {return "My Value"; };};});

Allt lítur nú svona út:

mod.factory ("myProvider", function () {console.log ("Factory function called."); return new function () {// INLINED object constructor our.getValue = function () {return "My Value"; };};}); mod.controller ("MyController", fall (myProvider) {console.log ("MyController - myProvider:" + myProvider.getValue ());}); mod.controller ("MyController2", fall (myProvider) {console.log ("MyController2 - myProvider:" + myProvider.getValue ());});

Opið í JS Fiddle

Þar sem öll verksmiðjan okkar samanstendur af einum hlut, þá væri ekki sniðugt ef við gætum bara gefið Angular hlutina sem framkvæmir framkvæmdaaðila í stað þess að þurfa að skrifa þessa angurverðu verksmiðju. Þú ert heppinn, þetta er þjónusta.

Í þjónustu þinni

Hér er sama kóða, nema að þjónusta er notuð í stað verksmiðju.

mod.service ("myProvider", aðgerð () {// "verksmiðja" breytt í "þjónustu" // ATH: Eina aðgerðin sem er samþykkt er hlutur framkvæmdaaðila áður en þetta.getValue = fall () {skila 'My Value';}; }); mod.controller ("MyController", fall (myProvider) {console.log ("MyController - myProvider:" + myProvider.getValue ());}); mod.controller ("MyController2", fall (myProvider) {console.log ("MyController2 - myProvider:" + myProvider.getValue ());}); CONSOLE útgáfa MyController - myProvider: My Value MyController2 - myProvider: My Value

Opið í JS Fiddle

Útgefandi vs verksmiðja vs þjónusta

Í stuttu máli eru veitendur, verksmiðjur og þjónusta öll veitendur. Verksmiðja er sérstakt tilfelli veitanda ef þú þarft aðeins $ get () aðgerð hjá þjónustuveitunni. Þú getur skrifað það með minni kóða. Þjónusta er sérstakt tilfelli verksmiðju þegar þú vilt skila dæmi af nýjum hlut með sama yfirburði og skrifa minni kóða.

Hvenær ættir þú að nota einn á móti öðrum?

Svarið er að þú ert að nota sérhæfðustu útgáfuna sem mun ná markmiði þínu. Segjum sem svo að þú skilir fyrirliggjandi hlut sem er skilgreindur annars staðar og samþykkir rök framkvæmdaaðila. Þú getur ekki sent rök fyrir þjónustuna svo þú hringir í staðinn frá verksmiðjunni.

mod.factory ("myProvider", fall () {console.log ("Verksmiðjuaðgerð kallað."); skila nýjum SomeMessageBoxClass ("sérsniðin rök");});

Einn helsti þátturinn í því að ákveða milli seljanda og verksmiðju er hvort þú viljir stilla mynda hlutinn áður en hann er búinn til. Þú gerir þetta með því að hringja í module.config () og senda dæmi til veitunnar sjálfs (í stað þess sem hluturinn veitir). Þú gerir þetta með því að bæta „veitanda“ við lok nafns veitunnar þegar þú sprautar því inn.

Hér er dæmi um hvernig þú myndir gera það:

mod.provider ("myProvider", fall () {this.value = "My value"; this.setValue = function (newValue) {this.value = newValue;}; þetta. $ get = function () {return this. Gildi;};}); mod.controller ("MyController", fall (myProvider) {console.log ("MyController - myProvider:" + myProvider);}); mod.config (fall (myProviderProvider) {// ADDED config hluti // Athugið viðbótar viðskeytið „Provider“ myProviderProvider.setValue („New Value“);});

Þetta felur í sér hvenær nota á þriggja veitendur: þjónustuaðila, verksmiðju og þjónustu. Það er til viðbótar veitandi sem ekki er minnst á hér, sem er annað sérstakt tilfelli, og það er gildi fyrir hendi.

Ef þú manst þegar við kynntum fyrsta verksmiðjuveituna hér að ofan gefum við einfalda dæmið um að skila strenggildi. Það leit svona út:

mod.factory ("myProvider", fall () {skila "Gildi mínu";});

Jæja, við hefðum í raun getað gert það með virðisveitunni, sem aftur hefur þann kost að þú getur gert það með minni kóða. Eftirfarandi kóða gerir það sama og hér að ofan:

mod.value ("myProvider", "My Value");

Hvenær myndir þú nota einn á móti öðrum? Þú myndir líklega nota verksmiðjuveituna ef þú vilt reikna gildi út frá öðrum gögnum, t.d. B. Gögn frá öðrum þjónustuaðila eða utanaðkomandi aðila. Og / eða þegar þú vilt reikna gildið nákvæmlega þegar það er beðið í fyrsta skipti. Hér eru nokkur dæmi:

// Dæmi þar sem verksmiðjan er háð „gildi“ fyrir hendi mod.value („margfeldi“, 3); mod.factory ("gildi", fall (margfeldi) {skila 10 * margfeldi;}); // dæmi þar sem verksmiðjan veltur á ytri gögnum mod.factory ("gildi", aðgerð (margfeldi) {var multiple = getDateFromExternalPage (); skila 10 * margfeldi;});

Gaf ég í skyn að verðmætið væri eini annar veitandinn? Jæja, ég laug, það er annað sem er mjög svipað í gildi, með tveimur litlum mun. Þessi té er kallaður stöðugur.

Munurinn á gildi og föstu er að gildi sem er tilgreint með stöðugum er fáanlegt meðan á uppsetningarstiginu stendur. Þú manst ef til vill frá fyrri tímum sem ég nefndi að veitan væri aðgengileg á meðan stillingar stóð, en þjónusta og verksmiðja voru það ekki.

Jæja, það er það sama fyrir gildi og stöðugt. Stöðugur er fáanlegur í stillingarstiginu og gildið er það ekki. Hinn munurinn er sá að ekki er hægt að breyta gildi föstu eins og nafnið gefur til kynna. Fyrsta gildi sem þú úthlutar því er það gildi sem það heldur. Ef þú reynir seinna að úthluta öðru gildi við það verður hunsað.

Hér er dæmi:

mod.value ("myValue", "Fyrsta verkefni"); mod.value ("myValue", "Second Assignment"); mod.constant ("myConstant", "Fyrsta verkefni"); mod.constant ("myConstant", "annað verkefni"); mod.controller ("MyController", fall (myValue, myConstant) {console.log ("myValue:" + myValue); console.log ("myConstant:" + myConstant);}); CONSOLE OUTPUT myValue: annað verkefni myConstant: fyrsta verkefni

Hér er yfirlit yfir hvenær ætti að nota hvert og eitt:

Þess virði

Þú tilgreinir einfalt bókstafsgildi.

mod.value ("myValue", 10);
    

Stöðugur

Þú verður að vera fær um að fá aðgang að þessu gildi meðan á uppsetningarstiginu stendur. (með .config ())

mod.constant ("myValue", 10); mod.config (fall (myValue) {console.log (myValue);});

Verksmiðja

Verðið sem þú tilgreindir verður að reikna með öðrum gögnum.

mod.factory ("myFactory", fall () {return 10;});
        

Þjónusta

Þú skilar hlut með aðferðum.

mod.service ("myService", fall () {var name = "Bob"; this.setName = fall (nýtt nafn) {this.name = newName;}; this.getName = fall () {skila þessu.nafni;} });
        

Útgefandi

Í stillingarstiginu viltu geta stillt hlutinn sem á að búa til áður en hann er búinn til.

mod.provider ("gróið", fall () {var nafn; this.setName = fall (nýtt nafn) {nafn = nýtt nafn;}; þetta. $ get = fall () {skila nýrri aðgerð () {this.sayHi = fall () {console.log ("Hæ" + nafn;};};};}); mod.config (fall (greeterProvider) {greeterProvider.setName ("John");});
        

Til að koma punktinum heim í síðasta sinn er hér mynd af þjónustuaðilanum með yfirlýstu vinnu, gildi og þjónustuhluta:


svara 2:

Innra með sér notar AngularJS Factory til að búa til þjónustuhlut og Provider til að búa til Factory mótmæla.

Verksmiðja gerir það

  1. Búa til hlut / dæmi Búðu til / frumstilla stofnaðan hlut / dæmi, mótaðu mótmæla / dæmið

Hugsaðu um Angular Factory sem abstrakt verksmiðjuhönnunarmynstur til að setja samhengið. AngularJS gerir þér kleift að búa til hlut að eigin vali með verksmiðjuaðferð þinni. Þú skilar þeim hlut sem búið var til svo forritið þitt geti notað hann sem þjónustu.

Í eftirfarandi dæmi geturðu valið á milli tveggja greiðslugáttar með einhverjum sem notar kóða / bókasafnið. Verksmiðjuaðferð þín getur ákveðið hvort þú eigir að búa til Paypal eða Stripe hlut. Þetta er mjög svipað Abstract Factory. Notendur PaymentService vita ekki hvaða þjónusta er notuð fyrir greiðslugáttina.

var myModule = horn.module ('myModule', []); myModule.constant ("PaymentGatewayName", "Stripe"); // eða "Paypal" myModule.factory ('paymentService', fall (PaymentGatewayName) {var payService; // þú ákveður hvaða hlut ætti að búa til út frá viðskiptakröfum // StripeGateway og PaypalGateway eru JavaScript flokkar PaymentGatewayName == " Rönd “) {payService = nýr StripeGateway (); // Sérsniðinn kóða til að frumstilla röndargáttina} annað (PaymentGatewayName == "Paypal") {betalingService = nýtt PaypalGateway (); // Sérsniðinn kóða til að frumstilla Paypal} // Sérsniðinn kóða til að frumstilla greiðslu Þjónustu skila payService;});

Ef þjónustukóði lítur svona út skaltu taka eftir leitarorðinu „þetta“. Þetta þýðir að Angular Core hefur þegar búið til hlutinn fyrir þig og þú stjórnar ekki lengur hlutarsköpuninni.

var myModule = horn.module ('myModule', []); myModule.service ('Cache', fall () {var localVariable = ""; // ekki hægt að hringja utan þessa.cacheSize = 5; // 5 MB this.objectsSize = 1000; // max 1000 hlutir this.put = fall (lykill, gildi) {...} this.get = fall (fá) {skila ...}});

svara 3:

Stóra spurningin í AngularJS: Service vs Factory v / s Provider. Hvað ætti ég að nota

Það eru ótal auðlindir á Netinu sem fjalla um efnið. Það kemur í ljós að þessi spurning birtist ennþá á mismunandi rásum í hverri viku eða svo og jafnvel eftir að hafa lesið tíu svörin á StackOverflow er hún samt ekki mjög skýr.

Ef þú heldur að þeir séu svipaðir, þá hefur þú rétt fyrir þér. Þeir eru mjög líkir. Reyndar eru þau öll eins. Þeir eru allir veitendur.

Lestu alla greinina -> AngularJS: Service v / s Factory v / s Provider - Undirbúðu viðtalið eftir 15 mínútur