Ang mga bagay ay ang pundasyon ng JavaScript. Maraming mga built-in na uri ng data ang kinakatawan bilang mga bagay. Upang maging matagumpay na developer ng JavaScript, kailangan mong magkaroon ng malinaw na pag-unawa sa kung paano gumagana ang mga ito. Ang mga bloke ng gusali ng isang bagay ay tinatawag na mga field nito o mga katangian ng object ng JavaScript. Ginagamit ang mga ito upang ilarawan ang anumang aspeto ng isang bagay. Maaaring ilarawan ng property ang haba ng isang listahan, ang kulay ng langit, o ang petsa ng kapanganakan ng isang tao. Ang paglikha ng mga bagay ay isang madaling proseso. Ang wika ay nagbibigay ng isang syntax na kilala bilang mga literal ng bagay, na tinutukoy ng mga kulot na brace.
Pag-access sa Mga Katangian
Ang wika ay nagbibigay ng dalawang entry para sa pag-access ng mga katangian. Ang una at pinakakaraniwan ay kilala bilang dot notation. Sa notasyon ng tuldok, maaaring ma-access ang isang mapagkukunan sa pamamagitan ng pagtukoy sa pangalan ng host object, na sinusundan ng tuldok at pangalan ng property. Halimbawa, kapag ang object.foo ay unang itinalaga ng value one, ang value nito ay magiging 2 pagkatapos ng execution Operator ng JavaScript mga bagay.
Ang isang alternatibong access syntax ay kilala bilang bracket notation. Sa notasyon, ang pangalan ng bagay ay sinusundan ng isang hanay ng mga square bracket. Sa kanila, ang pangalan ng property ay tinukoy bilang isang string:
object["foo"] = object["foo"] + 1.
Ito ay mas nagpapahayag kaysa sa dot notation dahil pinapayagan nito ang isang variable na tukuyin ang lahat o bahagi ng isang pangalan ng property. Posible ito dahil awtomatikong kino-convert ng JavaScript object interpreter ang expression na ito sa isang string at pagkatapos ay nakukuha ang kaukulang property. Mabilis na nilikha ang mga pangalan ng property sa pamamagitan ng pagsasama-sama ng mga nilalaman ng variable f sa string na "oo":
bagay = "bar".
Binibigyang-daan ng bracket notation ang mga pangalan ng property na maglaman ng mga character na ipinagbabawal sa dot notation. Halimbawa, ang sumusunod na pahayag ay ganap na legal sa panaklong. Gayunpaman, kung susubukan ng user na gumawa ng parehong pangalan ng property sa dot notation, makakatagpo sila ng syntax error:
object["!@#$% &*()."] = totoo.
Maaaring ma-access ang mga katangian ng mga nested JavaScript object sa pamamagitan ng mga chaining tuldok at/o panaklong. Halimbawa, ang sumusunod na object ay naglalaman ng nested object na pinangalanang baz na naglalaman ng isa pang object na pinangalanang foo na may property na pinangalanang bar na naglalaman ng value na limang:
var object = ( baz: ( foo: ( bar: 5 ) ) ).
Ina-access ng mga sumusunod na expression ang bar attached property. Ang unang expression ay gumagamit ng dot notation, habang ang pangalawang expression ay gumagamit ng square notation. Pinagsasama ng ikatlong expression ang parehong mga entry upang makamit ang parehong resulta:
- object.baz.foo.bar;
- bagay["baz"]["foo"]["bar"];
- bagay ["baz"].foo["bar"].
Ang mga ekspresyong tulad ng ipinakita sa nakaraang halimbawa ay maaaring magdulot ng pagkasira ng pagganap kung ginamit nang hindi tama at maging sanhi ng pagkabigo ng JavaScript object. Ang pagsusuri sa bawat tuldok o bracket na expression ay nangangailangan ng oras. Kung ginamit nang maraming beses ang parehong property, makatuwirang i-access ang property nang isang beses at pagkatapos ay iimbak ang value sa isang lokal na variable para sa lahat ng paggamit sa hinaharap.
Pag-andar bilang pamamaraan
Kapag ang isang function ay ginamit bilang isang pag-aari ng isang bagay, ito ay tinatawag na isang pamamaraan. Tulad ng mga katangian, tinukoy ang mga ito sa literal na notasyon ng object. Halimbawa:
var object = ( sum: function(foo, bar) ( return foo + bar; ) ).
Ang mga pamamaraan ng object ng JavaScript ay maaaring tawagin gamit ang mga marka at panaklong. Tinatawag ng sumusunod na halimbawa ang sum() na paraan mula sa nakaraang halimbawa gamit ang parehong mga entry:
- object.sum(1, 2);
- object["sum"](1, 2).
Ang literal na notasyon ng object ay kapaki-pakinabang para sa paglikha ng mga bagong bagay, ngunit hindi ito maaaring magdagdag ng mga katangian o pamamaraan sa mga umiiral na. Sa kabutihang-palad, ang pagdaragdag ng bagong data ay kasingdali ng paggawa ng statement ng pagtatalaga. Ang isang walang laman na bagay ay nilikha. Pagkatapos, gamit ang mga operator ng pagtatalaga, nagdaragdag kami ng dalawang katangian, foo, at bar, at ang paraan ng baz:
- var object = ();
- object.foo = 1;
- object.bar = null;
- object.baz = function() ( ibalik ang "hello from baz()"; ).
Program Encapsulation
Ang pangunahing ideya ng object-oriented programming ay hatiin ang mga programa sa mas maliliit na bahagi at gawing responsable ang bawat bahagi para sa pamamahala ng sarili nitong estado. Kaya, ang ilang kaalaman tungkol sa kung paano gumagana ang isang bahagi ng isang programa ay maaaring lokal sa bahaging iyon. Ang isang taong nagtatrabaho sa natitirang bahagi ng programa ay hindi dapat matandaan o kahit na malaman ang tungkol dito. Sa tuwing magbabago ang lokal na data na ito, ang code lang sa paligid nito ang kailangang i-update.
Ang iba't ibang bahagi ng naturang programa ay nakikipag-usap sa isa't isa sa pamamagitan ng mga interface, limitadong hanay ng mga function o binding na nagbibigay ng kapaki-pakinabang na functionality sa isang mas abstract na antas habang itinatago ang kanilang eksaktong pagpapatupad. Ang mga nasabing bahagi ng isang programa ay namodelo gamit ang mga bagay. Ang kanilang interface ay binubuo ng isang tiyak na hanay ng mga pamamaraan at katangian. Ang mga katangian na bahagi ng isang interface ay tinatawag na pampubliko. Ang natitira, na hindi dapat hawakan ang panlabas na code, ay tinatawag na pribado.
Maraming mga wika ang nagbibigay ng kakayahang makilala sa pagitan ng pampubliko at pribadong pag-aari at hindi pinapayagan ang panlabas na code na ma-access ang mga pribado. Ang JavaScript, na muling kumukuha ng minimalist na diskarte, ay wala pa. Kasalukuyang isinasagawa ang trabaho upang idagdag ang wikang ito. Samakatuwid, matagumpay na magagamit ng mga programmer ng JavaScript ang ideyang ito. Bilang isang tuntunin, naa-access na interface inilarawan sa dokumentasyon o komento. Karaniwang kasanayan din na maglagay ng underscore (_) sa simula ng mga pangalan ng property upang isaad na pribado ang mga property. Ang paghihiwalay ng interface mula sa pagpapatupad ay isang magandang ideya. Ito ay karaniwang tinatawag na encapsulation.
Mga Katangian
Ang isang bagay na may panaklong (...) ay tinatawag na literal na bagay. Maaari mong agad na ilagay ang ilang mga katangian sa naturang mga bracket (...). Halimbawa, ipares ang "key: value at iba pa":
let user = ( // isang object name: "John", // by key "name" store value "John" age: 30 // by key "age" store value 30 }.!}
Ang isang property ay may key (kilala rin bilang isang "pangalan" o "identifier") bago ang isang colon ":" at isang halaga sa kanan nito. Ang object ng gumagamit ay may dalawang katangian. Ang resultang user JavaScript object na may dalawang nilagdaang file na may label na "pangalan" at "edad". Maaari kang magdagdag, magtanggal at magbasa ng mga file mula rito anumang oras. Naa-access ang mga value ng property gamit ang dot notation. Maaari itong maging anumang uri. Maaari kang magdagdag ng boolean value. Para mag-alis ng property, gamitin ang delete sa Error case ng isang JavaScript object.
Ang lahat ng mga object ng error sa JavaScript ay mga inapo ng object ng Error o isang minanang object:
- Ang Syntax Error object ay namamana mula sa Error object.
- JSON Parse error ng isang partikular na uri ng Syntax Error object.
Para mas malalim pa ang pag-unawa sa kung paano nakikitungo ang mga application sa mga error sa JavaScript, tingnang mabuti ang Airbrake JavaScript, isang tool sa pagsubaybay ng error para sa mga real-time na alerto at agarang insight sa kung ano ang naging mali sa iyong JavaScript code.
Mga mensahe ng error na maaaring matanggap ng isang user bago magtanggal ng object ng JavaScript:
- Masamang control character sa literal na string.
- Masamang karakter sa literal na string.
- Mahina ang output ng Unicode.
- Masamang karakter sa pagtakas.
- Walang katapusang string.
- Hindi inaasahang non-numeric code.
- Walang mga numero pagkatapos ng decimal point.
- Unterminated fractional number.
- Walang mga numero pagkatapos ng tagapagpahiwatig ng antas.
- Walang mga numero pagkatapos ng exponent sign.
- Ang exponential part ay walang numero.
- Hindi inaasahang pagtatapos ng data.
- Hindi inaasahang keyword.
- Isang hindi inaasahang simbolo.
- Pagtatapos ng data kapag binabasa ang mga nilalaman ng isang bagay.
- Inaasahang pangalan ng pag-aari o ")".
Mga Katangian ng Computational
Maaari kang gumamit ng mga square bracket sa literal na bagay. Ang mga ito ay tinatawag na computed properties. Ang isang halimbawa ay ibinigay sa ibaba.
Ang kahulugan ng isang nakalkulang ari-arian ay simple: nangangahulugan ito na ang pangalan ng ari-arian ay dapat na kinuha mula sa prutas. Kaya kung ang isang bisita ay pumasok sa "mansanas", ang bag ay magiging (mansanas: 5). Maaari kang gumamit ng mas kumplikadong mga expression sa mga square bracket:
hayaan ang prutas = "mansanas";
: 5 // bag.appleComputers = 5
Ang mga square bracket ay mas malakas kaysa sa dot notation. Pinapayagan nila ang mga pangalan at mga variable ng ari-arian. Pero mas mahirap din silang magsulat. Kaya kadalasan, kapag ang mga pangalan ng ari-arian ay kilala at simple, isang tuldok ang ginagamit. At kung kailangan mo ng isang bagay na mas kumplikado, pagkatapos ay lumipat sa mga square bracket.
Pagpapareserba ng salita
Ang isang variable ay hindi maaaring magkaroon ng isang pangalan na katumbas ng isa sa mga nakalaan na salita tulad ng "para", "hayaan", "bumalik", atbp. Ngunit kapag nag-uuri ng mga bagay sa JavaScript, walang ganoong paghihigpit.
Sa prinsipyo, ang anumang pangalan ay pinapayagan, ngunit mayroong isang espesyal na isa: ito "__proto__" ay nakakakuha ng espesyal na paggamot para sa makasaysayang mga kadahilanan. Halimbawa, hindi mo ito maaaring itakda sa isang halaga maliban sa isang bagay:
obj.__proto__ = 5;
alert(obj.__proto__); // hindi gumana ayon sa nilalayon
Tulad ng nakikita mo mula sa code, ang layunin ng primitive 5 ay hindi pinansin. Ito ay maaaring pagmulan ng mga error at kahit na mga kahinaan kung ang operator ay nagnanais na mag-imbak ng mga arbitrary na key-value pairs sa isang bagay at payagan ang bisita na tukuyin ang mga susi. Sa kasong ito, maaaring piliin ng bisita ang "proto" bilang susi at magdagdag ng JavaScript sa bagay. May isang paraan upang gawing regular na ari-arian ang mga bagay gamit ang __proto__. Mayroon ding isa pang mapa ng mga istruktura ng data na sumusuporta sa mga arbitrary key.
Integer Properties
Ang terminong "integer property" dito ay nangangahulugang isang string na maaaring ma-convert mula sa isang integer nang walang pagbabago. Kaya, halimbawa, ang "49" ay isang integer na pangalan ng property dahil kapag na-convert ito sa isang integer at bumalik muli, ito ay pareho pa rin. Ngunit ang "+49" at "1.2" ay hindi ganoon. Sa kabilang banda, kung ang mga susi ay hindi integer, kung gayon ang mga ito ay nakalista sa pagkakasunud-sunod ng pagkakalikha ng mga ito. Halimbawa sa ibaba.
Upang ayusin ang problema sa mga dialing code, maaari kang "mandaya" sa pamamagitan ng paggawa ng mga code na hindi kumpleto. Pagdaragdag ng "+" (plus sign) bago ang bawat code ay sapat. Ngayon ay gagana ito ayon sa nilalayon.
Ang pagkakaiba sa pagitan ng mga bagay at primitive ay ang mga ito ay naka-imbak at kinopya "sa pamamagitan ng sanggunian". Ang mga primitive na halaga ay itinalaga at kinopya "bilang isang integer na halaga". Ang isang variable ay nag-iimbak ng isang "address sa memorya" sa halip na ang object mismo o isang "reference" dito. Maaari mong gamitin ang anumang variable upang ma-access at baguhin ang mga nilalaman nito.
Ang halimbawa sa itaas ay nagpapakita na mayroon lamang isang bagay at admin upang mag-log in dito. Pagkatapos, kung ibang key (user) ang gagamitin sa ibang pagkakataon, mapapansin ng user ang mga pagbabago.
Ang mga operator ng pagkakapantay-pantay == at mahigpit na pagkakapantay-pantay === para sa mga bagay ay gumagana sa parehong paraan. Ang dalawang bagay ay pantay lamang kung sila ay iisang bagay. Para sa mga paghahambing tulad ng obj1 > obj2 o mga paghahambing sa primitive obj == 5, ang mga bagay ay kino-convert sa primitives. Upang maging tapat, ang mga naturang paghahambing ay napakabihirang kailangan at kadalasan ay resulta ng isang error sa coding.
Pagpapatunay ng Bagay ng JavaScript
Ang mga bagay ay may access sa anumang ari-arian. Gayunpaman, kung wala man ito, hindi ito magiging error. Ang pag-access lamang sa isang hindi umiiral na ari-arian ay nagbabalik ng hindi natukoy. Nagbibigay ito ng isang napaka-karaniwang paraan upang subukan ang isang property at ihambing ito sa isang hindi natukoy. Nasa ibaba ang isang halimbawa.
Paggamit ng "in" para sa mga property na nag-iimbak ng hindi natukoy. Karaniwan ang isang mahigpit na "=== undefined" na pagsusuri sa paghahambing ay gumagana nang maayos. Kumain espesyal na kaso kapag ito ay nabigo at "in" ay gumagana nang tama. Ito ay kapag ang isang ari-arian ng isang bagay ay umiiral ngunit nananatiling hindi natukoy.
Sa code sa itaas, teknikal na umiiral ang obj.test property. Samakatuwid gumagana nang tama ang in operator. Ang mga sitwasyong tulad nito ay napakabihirang dahil hindi natukoy ang karaniwang itinalaga. Ang mga null na "hindi alam" o "walang laman" na mga halaga ay kadalasang ginagamit. Kaya, ang in operator ay epektibong isang bisita sa code.
"para sa..sa" loop
Upang mailipat ang lahat ng mga susi mula sa bagay patungo sa bagay, mayroong isang espesyal na anyo ng loop: para..sa. Ito ay isang ganap na naiibang bagay mula sa for(;;) construct.
Nasa ibaba ang isang halimbawa.
Pakitandaan na lahat ng "para sa" constructor ay nagbibigay-daan sa iyo na magdeklara ng isang looping variable sa loob ng isang loop bilang isang let key. Bilang kahalili, maaari kang gumamit ng ibang pangalan ng variable, key, sa halip.
Halimbawa, ang for(let prop in obj) ay malawak ding ginagamit.
Mayroong alternatibong "square bracket" na gumagana sa anumang string.
Ang punto dito ay nangangailangan na ang mga key ng object ng JavaScript ay isang wastong variable identifier, ibig sabihin ay walang mga puwang o iba pang mga paghihigpit. Dapat gawin ang pangangalaga upang matiyak na ang linya sa loob ng mga bracket ay sinipi nang tama. Nagbibigay din ang mga square bracket ng paraan upang makuha ang pangalan ng property mula sa resulta ng anumang expression, kumpara sa literal na string mula sa isang variable:
let key = "gusto ng mga ibon";
// same as user["likes birds"] = true;
user = totoo.
Dito maaring kalkulahin ang key variable sa runtime at depende sa input ng user at pagkatapos ay gagamitin para ma-access ang property. Nagbibigay ito ng mga programmer ng higit na kakayahang umangkop. Ang notasyon ng tuldok ay hindi maaaring gamitin sa katulad na paraan, dahil umuulit ito sa object ng JavaScript. Nasa ibaba ang isang halimbawa.
Const object
Ang isang ipinahayag na const object ay maaaring mabago. Ang isang halimbawa ay ibinigay sa ibaba.
Maaaring mukhang ang JavaScript object sa linya (*) ay magtapon ng isang error, ngunit hindi. Ito ay dahil kinukuha ng const ang halaga ng user mismo. At dito ang gumagamit ay nagpapanatili ng isang sanggunian sa parehong bagay sa lahat ng oras. Ang linya (*) ay napupunta sa loob ng bagay, hindi ito muling itinalaga sa user. Magbibigay ng error ang Const kung susubukan mong itakda ang user at iba pa. Ang pag-clone at pagsasama, ang Object.assign ay lumilikha ng isa pang reference sa parehong bagay kung kailangan itong ma-duplicate. Magagawa rin ito, ngunit medyo mas mahirap dahil walang built-in na pamamaraan ang JavaScript. Sa katunayan, ito ay bihirang kinakailangan. Ang pagkopya sa pamamagitan ng sanggunian ay ginagamit sa karamihan ng mga kaso. Ngunit kung talagang kailangan mo ito, kailangan mong lumikha ng isang JavaScript object at kopyahin ang istraktura ng isang umiiral na, pagkopya ng mga katangian nito sa isang primitive na antas. Nasa ibaba ang isang halimbawa.
At maaari mo ring gamitin ang Object.assign na paraan para dito. Ang mga argumentong dest at src1, ..., srcN ay mga bagay. Kinokopya nito ang mga katangian ng lahat ng mga bagay src1, ..., srcNINTO dest. Sa madaling salita, ang mga katangian ng lahat ng mga argumento, simula sa pangalawa, ay kinopya hanggang sa ika-1. Pagkatapos ay bumalik ito sa dest. Halimbawa, maaari mo itong gamitin upang pagsamahin ang ilang mga bagay sa isa.
At maaari mo ring gamitin ang Object.assign upang palitan ang simpleng clone loop. Kinokopya nito ang lahat ng mga katangian ng user sa isang walang laman na bagay at ibinabalik ito, tulad ng isang loop, ngunit mas maikli. Hanggang ngayon, ipinapalagay na ang lahat ng mga katangian ng user ay primitive. Ngunit ang mga katangian ay maaaring maging mga sanggunian sa iba pang mga bagay.
Upang ayusin ito, kailangan mong gumamit ng clone loop na sumusuri sa bawat halaga ng user at, kung ito ay isang bagay, pagkatapos ay ginagaya ang istraktura nito. Ito ay tinatawag na "deep cloning."
Mayroong karaniwang deep cloning algorithm na humahawak sa kaso sa itaas at mas kumplikadong mga kaso na tinatawag na Structured cloning algorithm. Upang maiwasan ang muling pag-imbento ng gulong, maaari kang gumamit ng gumaganang pagpapatupad mula sa lodash JavaScript library, ang pamamaraan ay tinatawag na _.cloneDeep(obj).
Mga Advanced na Pamamaraan
Kung ang isang programmer ay umiikot sa isang bagay at nais na makuha ang lahat ng mga katangian sa parehong pagkakasunud-sunod na idinagdag sa mga ito, maaari siyang umasa sa "espesyal na pag-order," kung saan ang mga katangian ng integer ay pinagbukod-bukod at ang iba ay nabuo sa pagkakasunud-sunod kung saan nilikha ang object ng JavaScript. .
Ang mga advanced na object method ay tumatalakay sa mga konsepto na bihirang ginagamit sa JavaScripting. Ito ay dahil sa mga normal na senaryo ay hindi kailangan ang mga makapangyarihang feature na ito. Ang ilan sa mga pamamaraang ito ay maaaring hindi gumana sa mas lumang mga browser, tulad ng mga maagang paglabas ng Netscape 4.
Ang prototype ay maaaring gamitin upang lumikha ng mga bagay na JavaScript at lahat ng mga pamamaraan ng mycircle, hindi lamang ang mga bago. Ito ay may magkahalong epekto sa pagganap. Hindi sila dapat mag-imbak indibidwal na mga kopya mga pamamaraan para sa bawat halimbawa ng bagay, kaya maaaring mangailangan ng mas kaunting memorya para gumana, ngunit dapat hanapin ng browser ang kasalukuyan at mga saklaw ng magulang upang mahanap ang mga ito. Maaari itong magresulta sa matinding latency. Sa pangkalahatan, dapat gamitin ng user kung ano ang naaangkop para sa code sa halip na ibase ang desisyong iyon sa pagganap, maliban kung nakikipag-ugnayan sila sa isang napaka-tiyak na kinokontrol na kapaligiran.
Bumalik ng totoo
Sa ilang mga kaso, maaaring kailanganin para sa pag-aari ng isang bagay na itali sa mismong bagay o sa isang lugar sa prototype chain. Sa JavaScript, ginagamit ng lahat ng object ang hasOwnProperty method, na nagbabalik ng true kung ang property na iyon ay nakatali sa isang indibidwal na object instance. Sa kasong ito, magiging posible na suriin kung ang tagabuo ng isang bagay ay may parehong pag-aari na may parehong halaga ng bagay na halimbawa mismo. Maaari itong magbigay ng mga maling resulta kung mayroon mga indibidwal na katangian JavaScript object na may parehong halaga para sa object instance at circuit prototype. Ang hasOwnProperty method ay tumatagal ng isang parameter - ang pangalan ng property bilang isang string.
Maaari kang lumikha ng mga pribadong pamamaraan sa katulad na paraan. Ito ay isang function na nilikha sa loob ng isang constructor function. Ito ay maaaring mukhang nakalilito sa ilan, ngunit iyan ay kung paano ito gumagana. Ang isang pribadong function ay maaari lamang tawagin ng mismong tagabuo o ng mga pamamaraan na tinukoy sa linya. Magagamit ang mga ito bilang mga pampublikong pamamaraan kung nakatalaga sa isang pampublikong tagapagtayo at na-access gamit bukas na mga pamamaraan Mga bagay sa JavaScript.
function myob() ( function cantBeSeen() ( alert(secretValue);
) var secretValue = "";
this.method1 = function () ( secretValue = "no surprises";!}
this.method2 = cantBeSeen;
) var oneOb = bagong myob();
oneOb.method1();
//alerts "no surprises" oneOb.method2();
//alerts "walang sorpresa".
Template ng Command
Ang mga command object ay nagbibigay-daan para sa maluwag na pinagsamang mga system sa pamamagitan ng paghihiwalay sa mga naglalabas ng kahilingan mula sa mga bagay at sa mga aktwal na nagpoproseso ng kahilingan. Ang mga kahilingang ito ay tinatawag na mga kaganapan, at ang code na nagpoproseso ng mga kahilingan ay tinatawag na mga tagapangasiwa ng kaganapan.
Ipagpalagay na gumagawa ka ng mga application na sumusuporta sa mga aksyon sa clipboard na Gupitin, Kopyahin at I-paste. Ang mga pagkilos na ito ay maaaring ma-trigger sa iba't ibang paraan sa buong application: sa pamamagitan ng menu system, menu ng konteksto, halimbawa, sa pamamagitan ng pag-right click sa field ng teksto o isang keyboard shortcut. Nagbibigay-daan sa iyo ang mga command object na isentro ang pagpoproseso ng mga pagkilos na ito, isa para sa bawat operasyon, kapag isang command lang ang kailangan para iproseso ang lahat ng kahilingan sa Pag-cut, isa para sa lahat ng kahilingan sa Kopyahin, at isa para sa lahat ng kahilingan sa I-paste.
Dahil ang mga koponan ay nakasentro sa lahat ng pagpoproseso, madalas din silang kasangkot sa paghawak ng mga pag-andar ng pag-undo para sa buong aplikasyon. Ang mga makabuluhang pagpapabuti ay maaaring makamit sa pamamagitan ng paggamit makabagong pamamaraan JavaScript, na nagreresulta sa mas mahusay, maaasahan, at mapapanatili na mga application.
Upang matutunan kung paano ito gawin, maaari mong gamitin ang mga template ng JavaScript + jQuery. Kasama sa natatanging package na ito ang naka-optimize na JavaScript para sa lahat ng template ng GoF gamit ang mga mas advanced na feature gaya ng mga namespace, prototype, module, function object, pagsasara, anonymous na function at higit pa. Kung kailangan ng mga user ang pinakabagong mga tool at diskarte para sa mga template ng JavaScript, mga template ng jQuery, at mga arkitektura ng template, kung gayon ito ang pinakamahusay na kaso ng paggamit. Ang paketeng ito ay naglalaman ng mahalagang, napapanahon na impormasyon para sa Mga developer ng JavaScript. Narito kung ano ang kasama:
- Mga template ng GoF na naka-optimize sa JavaScript.
- Mga Modernong Pattern ng Disenyo ng JavaScript.
- Mga Pattern ng Disenyo ng Model-View.
- Mga template ng disenyo ng jQuery.
- Mga pattern ng arkitektura ng mga idyoma ng JavaScript.
- Mga halimbawang application (MVC, SPA, atbp.)
Ang mga iminungkahing pangunahing kaalaman ng JavaScript object syntax ay napakahalaga para sa mga nagsisimulang programmer. Dapat munang maunawaan ng isa ang mga bagay, pagkatapos ay magkakaroon ng kaalaman sa object-oriented programming. Mahalagang magkaroon ng malalim na pag-unawa sa materyal na ito dahil ito ay nagsisilbing batayan para sa natitirang bahagi ng materyal. Wika ng JavaScript.
Ang JavaScript ay isang object-oriented na wika. Maliban sa mga pangunahing construct ng wika tulad ng mga loop at relational operator, halos lahat ng feature ng JavaScript ay ipinapatupad gamit ang mga object sa isang paraan o iba pa.
Minsan ang mga bagay ay tahasang ginagamit upang magsagawa ng mga partikular na gawain, tulad ng pagpoproseso ng (X)HTML at XML na mga dokumento batay sa Document Object Model. Sa ibang mga kaso, ang papel ng mga bagay ay hindi gaanong halata, tulad ng papel ng String object kapag nagtatrabaho sa primitive string data.
Nagbigay ang mga nakaraang kabanata ng mga halimbawa na malinaw na nagpapakita ng pagiging kapaki-pakinabang ng mga built-in na bagay, ngunit sa kabanatang ito ay direktang susuriin natin ang mga bagay sa JavaScript.
Mga bagay sa JavaScript
Ang mga bagay sa JavaScript ay maaaring hatiin sa apat na grupo.
- Mga object ng user na nilikha ng programmer at pagkakaroon ng istraktura at entity na angkop sa isang partikular na gawain sa programming. Tatalakayin natin ang mga posibilidad ng paglikha at paggamit ng mga naturang bagay sa kabanatang ito.
- Ang mga built-in na bagay ay ibinibigay ng wikang JavaScript mismo. Kabilang dito ang mga bagay na nauugnay sa mga uri ng data (String, Number, at Boolean), mga object na nagbibigay-daan sa iyong lumikha ng mga custom na object at composite na uri (Object at Array), at mga bagay na nagpapadali sa mga karaniwang gawain (gaya ng Date, Math, at RegExp) . Ang mga kakayahan ng mga built-in na bagay ay kinokontrol ng ECMA-262 na pamantayan ng wika at, sa mas mababang lawak, ng mga detalye ng tagagawa ng browser.
- Mga bagay sa browser na hindi bahagi ng wika ng JavaScript ngunit sinusuportahan ng karamihan sa mga browser. Ang mga halimbawa ng mga object ng browser ay Window, isang object kung saan pinapamahalaan at nakikipag-ugnayan ang mga browser window sa user, at Navigator, isang object na nagbibigay ng impormasyon sa configuration ng client. Dahil ang karamihan sa mga aspeto ng mga bagay sa browser ay hindi pinamamahalaan ng anumang mga pamantayan, ang kanilang mga katangian at pag-uugali ay maaaring mag-iba nang malaki depende sa parehong browser at sa bersyon nito. Ang mga bagay ng ganitong uri ay tatalakayin pa.
- Ang mga object ng dokumento ay bahagi ng Document Object Model (DOM). Bagay ng Dokumento Modelo) na tinukoy ng W3C consortium. Ang ganitong mga bagay ay nagbibigay sa programmer ng isang structured na interface sa (X)HTML at XML na mga dokumento. Ang mga bagay na ito ang nagbibigay sa JavaScript ng kakayahang manipulahin ang mga nested style sheet (CSS - Cascade Style Sheet) at pasimplehin ang pagpapatupad ng dynamic na HTML (DHTML). Ang pag-access sa mga bagay na dokumento ay ibinibigay ng browser sa pamamagitan ng pag-aari ng dokumento ng bagay na Window (window. dokumento). Pag-uusapan pa natin ang tungkol sa DOM mamaya.
Mga prinsipyo ng pagtatrabaho sa mga bagay
Bagay ay isang hindi maayos na koleksyon ng data, kabilang ang mga primitive na uri data, function at kahit iba pang mga bagay. Ang pakinabang ng mga bagay ay na sila ay tumutok sa isang lugar ng lahat ng data at lohika na kinakailangan upang maisagawa ang isang tiyak na gawain. tiyak na gawain. Ang String object ay nag-iimbak ng data ng teksto at nag-aalok ng marami sa mga function na kinakailangan upang kumilos dito. Kahit na ang pagkakaroon ng mga bagay sa isang programming language ay hindi naman kinakailangan (walang mga bagay sa wikang C, halimbawa), tiyak na pinapasimple nila ang paggamit ng wika.
Paglikha ng mga Bagay
Ang isang bagay ay nilikha gamit ang isang constructor - isang espesyal na uri ng function na naghahanda bagong bagay para sa paggamit, pagsisimula ng memorya na inookupahan ng Bagay. Sa Kabanata 4, nakita namin na ang mga bagay ay maaaring malikha sa pamamagitan ng paglalapat ng bagong operator sa kanilang mga konstruktor. Ang paggamit ng operasyong ito ay nagiging sanhi ng constructor upang lumikha ng isang bagong bagay, ang likas na katangian nito ay tinutukoy ng tinatawag na constructor. Halimbawa, Tagabuo ng string() constructor ay lumilikha ng mga String object, at ang Array() constructor ay lumilikha ng Array objects. Ito ay kung paano pinangalanan ang mga uri ng object sa JavaScript: sa pamamagitan ng pangalan ng constructor na lumilikha ng object.
Narito ang isang simpleng halimbawa ng paglikha ng isang bagay:
var lungsod = bagong String();
Lumilikha ang pahayag na ito ng bagong String object at naglalagay ng reference dito sa variable ng lungsod. Dito, hindi inaalok ang tagabuo ng anumang mga argumento, kaya ang variable ng lungsod ay makakakuha ng default na halaga nito - in sa kasong ito ito ay isang walang laman na string. Maaari mong gawing mas kawili-wili ang halimbawang ito sa pamamagitan ng pagpasa ng argumento sa constructor na tumutukoy sa paunang halaga:
var city = new String("San Diego");
Sa artikulong ito, nais kong pag-usapan nang buo at tuloy-tuloy hangga't maaari tungkol sa kung ano ang isang bagay sa JavaScript, kung ano ang mga kakayahan nito, anong mga ugnayan ang maaaring itayo sa pagitan ng mga bagay at kung anong mga pamamaraan ng "katutubong" mana ang sumusunod dito, kung paano nakakaapekto ang lahat ng ito. pagganap at kung ano sa pangkalahatan ang gagawin sa lahat ng ito :)
Ang artikulo ay HINDI magkakaroon ng isang salita tungkol sa: pagtulad sa tradisyonal na paradigma ng class-object, syntactic sugar, wrapper at frameworks.
Ang pagiging kumplikado ng materyal ay tataas mula sa simula hanggang sa katapusan ng artikulo, kaya para sa mga kalamangan ang mga unang bahagi ay maaaring mukhang mayamot at karaniwan, ngunit pagkatapos ay magiging mas kawili-wili :)
Mga bagay sa JavaScript
Maraming mga artikulo ang naglalaman ng pariralang "Sa JavaScript, ang lahat ay isang bagay." Sa teknikal, hindi ito ganap na totoo, ngunit gumagawa ito ng tamang impression sa mga nagsisimula :)Sa katunayan, marami sa wika ay isang bagay, at kahit na kung ano ang hindi isang bagay ay maaaring magkaroon ng ilan sa mga kakayahan nito.
Mahalagang maunawaan na ang salitang "bagay" ay ginagamit dito hindi sa kahulugan ng "isang bagay ng ilang uri." Ang isang object sa JavaScript ay una at pangunahin ay isang koleksyon lamang ng mga katangian (kung gusto mo, maaari mo itong tawaging associative array o listahan) na binubuo ng mga key-value pairs. Bukod dito, ang susi ay maaari lamang maging isang string (kahit na para sa mga elemento ng array), ngunit ang halaga ay maaaring maging anumang uri ng data na nakalista sa ibaba.
Kaya sa JavaScript mayroong 6 mga pangunahing uri
ang data ay Undefined (nagsasaad ng kawalan ng value), Null, Boolean (Boolean), String (string), Number (number) at Object (object).
Bukod dito, ang unang 5 ay primitive mga uri ng data, ngunit ang Object ay hindi. Bilang karagdagan, maaari naming kumbensiyonal na isaalang-alang na ang uri ng Bagay ay may "mga subtype": array (Array), function (Function), regular expression (RegExp) at iba pa.
Ito ay isang medyo pinasimple na paglalarawan, ngunit sa pagsasanay ito ay karaniwang sapat.
Bukod pa rito, ang mga primitive na uri na String, Number, at Boolean ay nauugnay sa ilang partikular na paraan sa mga hindi primitive na "subtypes" ng Object: String, Number, at Boolean, ayon sa pagkakabanggit.
Nangangahulugan ito na ang string na "Hello, world", halimbawa, ay maaaring gawin bilang primitive value o bilang String object.
Sa madaling salita, ginagawa ito upang ang programmer ay maaaring gumamit ng mga pamamaraan at katangian kapag nagtatrabaho sa mga primitive na halaga na parang sila ay mga bagay. Maaari mong basahin ang higit pa tungkol dito sa kaukulang seksyon ng artikulong ito.
Magtrabaho mula sa link
Ang sanggunian ay isang paraan ng pag-access sa isang bagay sa ilalim ng iba't ibang pangalan. Ang pagtatrabaho sa anumang mga bagay ay isinasagawa ng eksklusibo sa pamamagitan ng sanggunian.Ipakita natin ito sa isang halimbawa:
pagsubok= function () (alerto("Hello!" )) //Gumawa ng isang function (alert("Hello!")) (at isang function, gaya ng naaalala natin, ay isang ganap na object) at gawing reference dito ang test variable
test_link=test; //test_link ngayon ay tumutukoy din sa aming function
pagsubok(); //Hello!
test_link(); //Hello!
Tulad ng nakikita natin, pareho ang unang link at ang pangalawa ay nagbibigay ng parehong resulta.
Kailangan nating mapagtanto na wala tayong anumang function na pinangalanang test, at ang test variable ay hindi isang uri ng "pangunahing" o "pangunahing" link, at ang "test_link" ay isang minor.
Ang aming function, tulad ng anumang iba pang bagay, ay isang lugar lamang sa memorya, at lahat ng mga reference sa lugar na ito ay ganap na katumbas. Bukod dito, ang bagay ay maaaring walang anumang mga sanggunian - sa kasong ito ito ay tinatawag na anonymous, at magagamit lamang kaagad pagkatapos ng paglikha (halimbawa, ipinasa sa isang function), kung hindi, imposibleng ma-access ito at malapit na. sisirain ng basurero ( koleksyon ng basura), na responsable para sa pagtanggal ng mga bagay na walang mga sanggunian.
Tingnan natin kung bakit napakahalagang maunawaan ito:
pagsubok=(prop: "sometext") //Gumawa ng isang bagay gamit ang prop property
test_link=test; //Gumawa ng isa pang link sa bagay na itoAlerto(test.prop); //sometext
//Baguhin ang ari-arian ng bagay
test_link.prop="newtext" ;Alerto(test.prop); //bagong teksto
alerto(test_link.prop); //bagong teksto
/*Maaaring sabihin na ang ari-arian ay nagbago dito at doon - ngunit hindi ito ganoon.
Mayroon lamang isang bagay. Kaya't ang property ay nagbago dito nang isang beses, at ang mga link ay patuloy na tumuturo kung saan sila itinuro. *///Magdagdag ng bagong property at alisin ang luma
test.new_prop="hello" ;
tanggalin ang test.prop;Alerto(test_link.prop); //undefined - wala na ang property na ito
alerto(test_link.new_prop);//Burahin ang link
tanggalin ang pagsubok;
alerto(test.new_prop);
/*Sa puntong ito ang script ay maghahagis ng isang error, dahil ang pagsubok ay wala na, at ang test.new_prop ay wala nang higit pa kaya */
alerto(test_link.new_prop); //hello
/* ngunit narito ang lahat ay maayos, dahil hindi namin tinanggal ang bagay mismo, ngunit isang link lamang dito. Ngayon ang aming bagay ay itinuro ang tanging link test_link *///Gumawa ng bagong bagay
test=test_link; //Una, likhain muli ang pansubok na link
test_link=(prop: "sometext") //At narito ang bagong bagayAlerto(test_link.prop); //sometext
alerto(test.prop); //hindi natukoy
/* Ang paglikha ng isang bagong bagay ay sumisira sa reference na link, at ngayon ang pagsubok at test_link ay tumuturo sa iba't ibang mga bagay.
Sa katunayan, ito ay katumbas ng pagtanggal ng test_link at paggawa nito muli, ngunit pagturo sa ibang bagay */
alerto(test.new_prop); //hello - ngayon ang pagsubok ay naglalaman ng isang link sa aming pinakaunang bagay
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Ang pag-uugaling ito ng mga bagay ay kadalasang naglalabas ng maraming tanong para sa mga baguhan na developer, kaya umaasa akong ang tekstong ito ay magdadala ng kaunting kalinawan. Kung gusto naming lumikha ng isang tunay na bago, independiyenteng kopya ng bagay, at hindi isang link, kung gayon ang tanging paraan upang gawin ito ay lumikha ng isang bagong bagay at kopyahin ang mga kinakailangang katangian doon.
Dapat ding tandaan na ang pagtatrabaho sa mga bagay sa pamamagitan ng sanggunian, bilang karagdagan sa mga nakakatuwang epekto na nakalista sa itaas, ay nagbibigay din ng makabuluhang pagtitipid sa memorya, na mahalaga kapag ang isang bagay ay malawakang ginagamit sa iba't ibang lugar sa programa.
Mga primitive na halaga
Tulad ng nabanggit ko sa itaas, mga uri String ng data at Numero ay maaaring maging mga bagay o primitive na halaga.obj= bagong String("hello" ); //Gumawa ng isang string bilang isang bagay
simple="hello" ; //Gumawa ng primitive na halagaAlerto(obj); //hello
alerto (simple); //hello - sa ngayon lahat ay predictableAlert(obj.length); //6 - ang isang bagay na may uri ng String ay may haba na katangian na nag-iimbak ng haba ng string
alerto(simple.length); //6
/* Bagama't ang simple ay hindi isang bagay, maa-access natin ang parehong hanay ng mga katangian bilang isang String object. Ito ay medyo maginhawa */Obj.prop="text" ;
simple.prop="text" ;Alerto(obj.prop); //text - dahil ang obj ay isang regular na bagay, madali nating mabibigyan ito ng isa pang property
alerto(simple.prop); //undefined - ngunit ang simple ay hindi isang bagay, at ang numerong ito ay hindi gagana para sa amin* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Ang parehong ay totoo para sa parehong mga uri ng Number at Boolean (mabuti, maliban na wala silang property na haba, ngunit mayroon silang maraming iba pang magagandang katangian).
Ang paggamit ng mga string at numero bilang mga bagay ay walang anumang praktikal na benepisyo, dahil Ang mga primitive na halaga ay mas maginhawang gamitin, ngunit sa parehong oras ay panatilihin ang lahat ng kinakailangang pag-andar. Gayunpaman, upang makumpleto ang larawan, kinakailangan upang maunawaan ang mekanismong ito.
Huwag malito ang paggamit ng mga primitive na halaga sa paggamit ng mga literal - halimbawa, lumikha man kami ng array bilang "test=new Array()" o bilang "test=", ang resulta ay magiging pareho pa rin ng object. Hindi kami makakatanggap ng anumang primitive na halaga.
Paglikha at Paggamit ng mga Bagay
Kaya, hindi tulad ng mga wika na nagpapatupad ng paradigm ng class-object, hindi natin kailangang lumikha muna ng isang klase at pagkatapos ay lumikha ng isang object ng klase. Maaari kaming agad na lumikha ng isang bagay, na kung ano ang gagawin namin sa sumusunod na halimbawa:pagsubok=(
simple_property: "Hello" ,
object_property: (
user_1: "Petya" ,
user_2: "Vasya"
},
function_property: function (user) (
alert(this .simple_property + "," + this .object_property);
}
}Test.function_property("user_1" ); //Hello, Petya.
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Narito mayroon kaming isang pagsubok na bagay na may 3 mga katangian, ang mga pangalan kung saan, umaasa ako, ay nagsasalita para sa kanilang sarili. Ang pinaka-interesado sa amin tungkol dito ay ang function_property, na naglalaman ng function. Ang ganitong function ay maaaring tawaging object method.
Ginagamit ng aming function ang keyword na ito nang dalawang beses, na isang pointer (i.e., isang reference) sa object kung saan tinawag ang function. Kaya, this.simple_property=test.simple_property="Hello", at this.object_property=test.object_property="Peter".
Mahalagang maging malinaw na ito ay palaging tumuturo sa object kung saan tinawag ang function, at hindi sa object kung saan ito nabibilang. Bagama't nasa sa halimbawang ito ito ay ang parehong bagay, ito ay hindi palaging ang kaso.
test.function_property("user_1" ); //Hello, Petya.Pagsubok2=bagong Bagay(); // Isa pang paraan ng paglikha ng isang bagong bagay, katulad ng test2=()
Test.function_property.call(test2, "user_1" ); //error
/* Ang paraan ng pagtawag ay nagpapahintulot sa iyo na tumawag sa isang function sa ngalan ng isa pang bagay. Sa kasong ito, tinatawag namin ang function_property method ng test object, at hindi na ito tumuturo sa test object, ngunit sa test2 object. At dahil wala itong object_property property, at kapag sinubukan mong makuha ito.object_property ang script ay maghahagis ng error *///subukan nating ayusin ang sitwasyon
test2.simple_property="Magandang araw" ;
test2.object_property=test.object_property; //Sa kasong ito, gagamitin namin ang pagtukoy sa bagay sa pamamagitan ng sanggunian upang hindi ma-duplicate ang codeTest.function_property.call(test2, "user_1" ); //Magandang araw, Petya.
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Dapat ding malinaw sa halimbawa na walang malinaw na hakbang para sa paglikha at paggamit ng isang bagay. Ang isang bagay ay maaaring baguhin sa anumang paraan sa anumang oras - bago, pagkatapos at kahit habang ginagamit. Ito rin mahalagang pagkakaiba mula sa "tradisyonal" OOP.
Tagabuo
Sa halimbawa sa itaas, lumikha kami ng 2 bagay na may ilang pagkakatulad. Parehong may simple_property at object_property properties. Malinaw, kapag nagsusulat ng totoong code, madalas na lumitaw ang gawain ng paglikha ng magkapareho o magkatulad na mga bagay. At siyempre, hindi natin kailangang likhain nang manu-mano ang bawat naturang bagay.Isang taga-disenyo ang tutulong sa amin. Ang isang constructor sa JavaScript ay hindi bahagi ng isang klase (dahil walang mga klase), ngunit isang function lamang sa sarili nitong karapatan. Ang pinakakaraniwang function.
make_me= function (_name) (
alert("Inilunsad ako" );
ito .name=_name;
}
/* Alamin natin kung ano ang nangyayari dito. Nakikita ng interpreter ang bagong operator at tinitingnan kung ano ang nasa kanan nito. kasi Ang make_me ay isang function, at maaari itong magamit bilang isang constructor, pagkatapos ay isang bagong object ang nilikha sa memorya at ang make_me function ay inilunsad para sa pagpapatupad, at ito ay tiyak na tumuturo sa bagong object na ito. Susunod, ang bagay na ito ay idinagdag gamit ang isang property ng pangalan, na itinalaga ang halaga mula sa argumento ng _name, at isang paraan ng show_name. Gayundin (hindi ko alam kung anong punto, ngunit hindi mahalaga) ang variable ng bata ay nagsisimulang tumuro sa aming bagong-bagong bagay na ipinanganak lamang */Alerto(pangalan ng bata); //Vasya
child.show_name(); //Vasya
child2.show_name(); //PetyaChild2.show_name=function () (alerto( "Hindi ko sasabihin ang pangalan ko");} //Huwag kalimutan na maaari nating baguhin ang ating mga bagay anumang oras
child2.show_name(); //Hindi ko sasabihin ang pangalan koChild.show_name(); //Vasya - ang mga bata ay hindi nakakaimpluwensya sa bawat isa sa anumang paraan
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Maaari mo ring ihambing ang isang taga-disenyo sa isang ama - siya ay nagsilang ng isang bata, na pinagkalooban siya ng ilang mga katangian, ngunit kaagad pagkatapos ng paglikha ang bata ay naging ganap na independyente sa magulang at maaaring maging ibang-iba sa kanyang mga kapatid.
Kung naaalala natin ang paglalarawan ng mga uri ng data sa simula ng artikulo, magiging malinaw na ang Object at ang mga subtype nito (Function, Array at iba pa) ay talagang mga constructor na nagbibigay sa nilikha na object ng mga kakayahan ng isang function, array, atbp.
Kaya ito ay mas mahusay na. Mayroon na tayong kakayahang lumikha ng mga bagay ayon sa ilang pattern. Gayunpaman, hindi pa maayos ang lahat. Una, ang bawat bagay na nilikha natin at ang lahat ng mga katangian at pamamaraan nito ay sumasakop sa isang hiwalay na lugar sa memorya, bagaman sa maraming paraan ay paulit-ulit ang mga ito. Pangalawa, paano kung gusto nating mapanatili ang koneksyon sa pagitan ng magulang at anak, at magagawang baguhin ang lahat ng bagay ng bata nang sabay-sabay. Isang prototype ang tutulong sa atin.
Prototype
Kung paanong ang bawat bata ay may ama at ina (hindi bababa sa isang biological na kahulugan), ang bawat bagay sa JavaScript ay mayroon ding isa. At kung ang ama, tulad ng natukoy natin, ay nagtatrabaho bilang isang taga-disenyo, kung gayon ang ina ay isang prototype lamang. Tingnan natin kung paano ito nangyayari:make_me= function (_name) (
alert("Inilunsad ako" );
ito .name=_name;
ito .show_name=function () (alerto(ito .name);)
}
/*
Nakikita ang keyword ng function, sinusuri ng interpreter ang code sa kanan nito, at iba pa. lahat ay ok - ito ay lumilikha ng isang bagong bagay sa memorya, na kung saan ay din ang aming function. Pagkatapos, awtomatiko (nang walang interbensyon ng programmer) ang isang prototype na property ay nilikha para sa function na ito, na tumutukoy sa isang walang laman na bagay. Kung ginawa namin ito nang manu-mano, magmumukha itong make_me.prototype=new Object();Pagkatapos, ang bagay na ito (itinuro ng prototype na ari-arian) ay awtomatikong binibigyan din ng isang constructor property, na tumuturo pabalik sa function. Ito ay lumiliko na ito ay isang paikot na link.
Ngayon ang bagay na ito, na maaaring ilarawan bilang (tagabuo: ...narito ang isang sanggunian sa isang function...) ay ang prototype ng function.
*///Bagay - talaga, isang bagay
alert(typeof make_me.prototype.constructor); //Function ang function natin
alert(make_me.prototype.constructor === make_me); //totoo//Magdagdag ng mga function ng make_me sa prototype bagong paraan
Bata=new make_me("Vasya"); //Ako ay inilunsad
/* Ngayon, bilang karagdagan sa lahat ng inilarawan sa nakaraang halimbawa, isang karagdagang nakatagong property [] ang nilikha sa child object, na tumuturo sa parehong bagay bilang make_me.prototype. kasi ang pag-aari ay nakatago, hindi namin maaaring tingnan ang halaga nito o baguhin ito - gayunpaman ito ay gumaganap mahalagang papel sa hinaharap na trabaho */Alerto(pangalan ng bata); //Vasya
child.show_name(); //VasyaChild.set_name("Kolya" );
/* Una, hinahanap ng interpreter ang set_name method sa child object. Dahil wala ito doon, patuloy itong naghahanap sa bata.[ ari-arian, hinahanap ito doon, at pinapatakbo ito. */
child.show_name(); //Kolya - ngayon ang pangalan ni Vasya ay Kolya :)Make_me.prototype.show_name2=function () (alert("Hello, " + this .name;) //Dahil ang isang prototype ay isang ordinaryong bagay, maaari rin nating baguhin ito sa mabilisang
Child2=new make_me("Petya" );
child2.show_name2(); //Hello, Petya
child.show_name2(); //Kumusta, Kolya - ang mga pagbabago sa prototype ay nakakaapekto hindi lamang sa mga bagong nilikha na bagay, kundi pati na rin sa lahat ng lumaChild2.show_name2=function () (alerto( "Hindi ko sasabihin ang pangalan ko");} //Maaari pa rin nating baguhin ang mismong bagay, habang ang bagong show_name2 na paraan sa bagay na ito (at dito lamang) ay, kumbaga, "na-overwritten" lumang pamamaraan mula sa prototype
child2.show_name2(); //Hindi ko sasabihin ang aking pangalan - dahil... mayroon na tayong sariling pamamaraan na show_name2, pagkatapos ay tinawag ito, at hindi naganap ang paghahanap sa prototypeChild.show_name2(); //Hello, Kolya - lahat ay pareho pa rin dito
Make_me.prototype=(prop: "hello") //Subukan nating muling likhain ang prototype
Alerto(bata.prop); //hindi natukoy
child.show_name2(); //Kumusta, Kolya
/* Kung naaalala mo kung ano ang gumagana sa pamamagitan ng sanggunian, kung gayon ang lahat ay malinaw. Ang muling paggawa ng prototype ay sumisira sa koneksyon, at ngayon ang [] property ng child at child2 object ay tumuturo sa isang object (na dati ay prototype ng make_me function), at ang make_me.prototype property ay tumuturo sa isa pang object, na siyang bago. prototype ng make_me function */Child3=new make_me("Oleg" );
alerto(bata3.prop); //hello - gaya ng inaasahan
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Tulad ng makikita sa halimbawa, hangga't ang ama ay nananatiling tapat sa ina (iyon ay, hangga't ang uri ng tungkulin ay nananatiling pareho), ang lahat ng mga bata ay nakasalalay sa ina at sensitibo sa lahat ng mga pagbabago sa kanya. Gayunpaman, sa sandaling maghiwalay ang mga magulang (binago ng taga-disenyo ang prototype sa isa pa) - agad na nagkalat ang mga bata sa lahat ng direksyon at wala nang pakikipag-ugnayan sa kanila.
Medyo tungkol sa terminolohiya
Hangga't ang pangunahing koneksyon sa pagitan ng taga-disenyo at ng prototype ay hindi nasira, maaari nating obserbahan ang sumusunod na larawan:
make_me= function (_name) (
alert("Inilunsad ako" );
ito .name=_name;
ito .show_name=function () (alerto(ito .name);)
}Make_me.prototype.set_name=function (_name) (ito .name=_name;)
child=new make_me("Vasya" );Alert(typeof make_me.prototype); //object - may prototype property ang function
alert(uri ng bata.prototype); //undefined - WALANG prototype property ang nilikhang object
alerto(child.constructor.prototype === make_me.prototype); //true - ngunit ang bagay ay may isang constructor property, na tumuturo sa constructor function na make_me, na kung saan, ay may isang prototype property
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Tulad ng napansin ko pagkatapos magbasa ng maraming mga forum sa paksang ito, ang pangunahing problema ng mga tao ay kapag nalilito nila ang prototype na property ng isang function sa nakatagong [] property ng object na nilikha ng function na iyon.
Pareho sa mga pag-aari na ito ay isang sanggunian sa parehong bagay (hangga't ang pangunahing koneksyon sa pagitan ng prototype at ang constructor ay hindi nasira), ngunit ang mga ito ay magkaibang mga katangian, na may iba't ibang mga pangalan, isa sa mga ito ay naa-access sa programmer, at ang iba ay hindi.
Laging kinakailangan na malinaw na maunawaan na kung pinag-uusapan natin ang prototype ng constructor, kung gayon ito ay palaging ang prototype na pag-aari, at kung pinag-uusapan natin ang prototype ng nilikha na bagay, kung gayon ito ang nakatagong pag-aari [].
Mana
Ngayon alam na natin na ang bawat object ay may nakatagong prototype reference, at ang bawat prototype ay isang regular na object.Ang pinaka-sensitive na mga mambabasa ay nahuli na ang amoy ng recursion :)
Sa katunayan, dahil ang isang prototype ay isang ordinaryong bagay, pagkatapos ito, sa turn, ay may isang link sa prototype nito, at iba pa. Sa ganitong paraan, ipinapatupad ang isang hierarchy ng mga prototype.
ibon= function()() //Ito ang tagabuo ng ibon
bird.prototype.cry=function ()(alert("Cry!");) //Maaaring sumigaw ang ibon
bird.prototype.fly=function ()(alert("Ako ay lumilipad!");) //at lumipadDuck=function () ()
duck.prototype=bagong ibon();
duck.prototype.cry=function ()(alert("Quack-quack!" ;) //Iba ang sigaw ng pato
duck.prototype.constructor=duck; //Sapilitang itakda ang prototype.constructor property sa pato, dahil kung hindi, ito ay tumutukoy sa ibonBilly = bagong pato(); //Si Billy ang pato natin
billy.fly(); //Lilipad ako! - Makakalipad si Billy dahil isa siyang ibon.
billy.cry(); //Quack-quack! - sigaw ni Billy ng kwek-kwek dahil isa siyang pato.
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Sa ganitong paraan maaari kang magpatupad ng hierarchy ng anumang antas ng nesting.
Bituin ang gawain
Ngayon, dahil marami tayong alam tungkol sa lahat ng ito, subukan nating alamin kung gaano karami ang nangyayari sa tatlong linyang ito.make_me= function()()
child=new make_me();
alert(child.toString()); //mga output
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Sa unang linya lumikha kami ng isang bagong function at isang variable na tinatawag na make_me na tumuturo sa function na iyon. Lumilikha ito ng isang function na prototype, make_me.prototype, na naglalaman ng isang constructor property na tumuturo sa make_me.
Pero hindi lang yun :)
kasi ang make_me function ay isa ring object, pagkatapos ito, naman, ay may ama at ina, i.e. taga-disenyo at prototype. Ang constructor nito ay isang katutubong function ng Function() na wika, at ang prototype nito ay isang object na naglalaman ng mga method call, apply, atbp. - Ito ay salamat sa prototype na ito na maaari naming gamitin ang mga pamamaraan sa anumang function. Kaya, ang make_me function ay may [] property na tumuturo sa Function.prototype.
Sa turn, ang prototype ng isang Function constructor ay isa ring object, ang constructor nito ay (sorpresa!) Object (i.e. Function.prototype.[].constructor===Object), at ang prototype ay isang object na naglalaman ng standard properties at mga pamamaraan ng bagay, tulad ng toString, hasOwnProperty at iba pa (sa madaling salita - Function.prototype.[]["hasOwnProperty"] - ito mismo ang paraan na magagamit natin sa lahat ng mga hinangong bagay - at ito ang sariling pamamaraan ng bagay na ito, at hindi isang minana ). ganito sa isang kawili-wiling paraan natuklasan namin na ang lahat ng uri ng mga bagay ay nagmula sa Bagay.
Maaari pa ba tayong magpatuloy? Hindi pala. Ang Object.prototype ay naglalaman ng mga pangunahing katangian ng object dahil wala itong sariling prototype. Object.prototype.[]=null; Sa puntong ito, humihinto ang paglalakbay sa prototype chain sa paghahanap ng property o method.
Ang isa pang kawili-wiling katotohanan ay ang constructor ng Object ay Function. Yung. Bagay.[].tagabuo ===Pag-andar.
May isa pang circular reference - ang constructor ng Object ay Function, at ang constructor ng Function.prototype ay Object.
Bumalik tayo sa ating halimbawa. Naunawaan na natin kung paano nilikha ang function, ngayon ay lumipat tayo sa pangalawang linya. Doon ay lumikha kami ng isang child object na ang constructor ay ang make_me function at ang prototype ay make_me.prototype.
Buweno, sa ikatlong linya ay makikita natin kung paano inaakyat ng interpreter ang kadena, mula sa bata hanggang sa bata.[] (aka make_me.prototype), pagkatapos ay sa bata.[].[] (aka Object.prototype), at nahanap na doon ang toString method, na naglulunsad ng execution.
mga dumi
Maaaring mukhang ang pamana sa pamamagitan ng mga prototype ay ang tanging paraan na posible sa JavaScript. Mali ito.Nakikitungo kami sa isang napaka-flexible na wika na nagbibigay ng mga posibilidad sa halip na mga panuntunan.
Halimbawa, kung nais namin, hindi namin maaaring gamitin ang mga prototype sa lahat, ngunit programa gamit ang konsepto ng mixins. Para dito kakailanganin namin ang aming mabubuting matandang kaibigan - mga taga-disenyo.
//Ito ay isang human constructor
tao=function() (
this .live=function ()(alert("Live ako" ;) //Marunong mabuhay ang tao
this .walk=function ()(alert("Naglalakad ako" ;) //Nakakalakad ang lalaki
}//Ito ang tagabuo ng makata
makata=function ()(
this .kill=function ()(alerto( "Ang makata ay pumatay ng isang tao");} //Ang isang makata ay maaaring pumatay ng tao
this .live=function ()(alert("Patay na ako" ;) //Ang isang tao ay mamamatay dahil dito
}Vladimir=bagong tao(); //Lalaki si Vladimir
vladimir.live(); //Nabubuhay ako - buhay siya
vladimir.walk(); //Naglalakad ako - naglalakad siyaPoet.call(vladimir); //Ipatupad ang makata constructor para sa vladimir object
vladimir.kill(); //Pinatay ng makata ang isang lalaki
vladimir.live(); //Patay na ako//Ngayon tumutok
man.call(vladimir);
vladimir.live(); //Nabubuhay ako
* Ang source code na ito ay na-highlight gamit ang Source Code Highlighter.
Ano ang nakikita natin sa halimbawang ito? Una, posibleng magmana mula sa ilang mga bagay na wala sa parehong hierarchy. Sa halimbawa ay mayroong 2 sa kanila, ngunit maaaring mayroong kasing dami hangga't gusto mo.
Pangalawa, walang hierarchy. Ang pag-override ng mga katangian at pamamaraan ay natutukoy lamang sa pamamagitan ng pagkakasunud-sunod kung saan tinawag ang mga konstruktor.
Pangatlo, ito ay ang kakayahang baguhin ang isang bagay nang mas pabago-bago, partikular ang isang indibidwal na bagay, at hindi lahat ng mga inapo nito, tulad ng kapag binabago ang isang prototype.
Upd: Mga pagsasara at pribadong pag-aari
Upang hindi palakihin ang medyo malaking artikulong ito, nagbibigay ako ng isang link sa post na Mga Pagsasara sa JavaScript, kung saan ito ay nakasulat sa ilang detalye.Ano ang gagawin ngayon sa lahat ng ito
Tulad ng sinabi ko sa itaas, ang di-makatwirang pagbabago ng mga indibidwal na bagay, ang paggamit ng mga konstruktor, mixin, at ang kakayahang umangkop ng mga prototype ay mga tool lamang, mga pagkakataon na nagpapahintulot sa programmer na lumikha ng parehong kahila-hilakbot at kamangha-manghang code sa lahat ng aspeto. Mahalaga lamang na maunawaan kung anong mga problema ang ating malulutas, sa pamamagitan ng anong paraan, kung anong mga layunin ang ating naabot at kung anong presyo ang binabayaran natin para dito.Bukod dito, ang tanong ng presyo ay medyo hindi mahalaga, lalo na kung pinag-uusapan natin ang tungkol sa pag-unlad para sa browser Internet Explorer 6 at 7 na bersyon.
1. Memorya - lahat ay simple dito. Sa lahat ng mga browser, ang pagmamana sa mga prototype ay tumatagal ng mas kaunting memorya kaysa sa paggawa ng mga pamamaraan sa pamamagitan ng mga constructor. Bukod dito, ang mas maraming mga pamamaraan at katangian na mayroon kami, mas malaki ang pagkakaiba. Gayunpaman, ito ay nagkakahalaga ng pag-alala na kung wala tayong isang libo magkatulad na mga bagay ngunit isa lamang, kung gayon ang pagkonsumo ng memorya ay magiging maliit sa anumang kaso, dahil Mayroong iba pang mga kadahilanan na dapat isaalang-alang dito.
2. Oras ng processor - dito ang mga pangunahing subtleties ay partikular na nauugnay sa mga browser mula sa Microsoft.
Sa isang banda, ang mga bagay kung saan ang mga pamamaraan at katangian ay nilikha sa pamamagitan ng isang constructor ay maaaring malikha ng maraming beses (sa ilang mga kaso sampu at daan-daang beses) na mas mabagal kaysa sa pamamagitan ng isang prototype. Ang mas maraming mga pamamaraan, mas mabagal ito. Kaya't kung ang iyong IE ay nag-freeze nang ilang segundo sa panahon ng pagsisimula ng script, mayroong isang dahilan upang maghukay sa direksyong ito.
Sa kabilang banda, ang mga sariling pamamaraan ng isang bagay (ang nilikha sa pamamagitan ng tagabuo) ay maaaring tumakbo nang mas mabilis kaysa sa mga pamamaraan ng prototype. Kung talagang kailangan mong pabilisin ang pagpapatupad ng isang partikular na pamamaraan sa browser na ito, kailangan mong isaalang-alang ito. Tandaan na ang tawag sa pamamaraan (i.e., hinahanap ito sa object) ang pinabilis, hindi ang pagpapatupad nito. Kaya't kung ang pamamaraan mismo ay tumatakbo nang isang segundo, hindi mo mapapansin ang labis na pagtaas sa pagganap.
Sa ibang mga browser mga katulad na problema Napansin na ang oras para sa paglikha ng mga bagay at pagtawag sa kanilang mga pamamaraan ay halos pareho para sa parehong mga diskarte.
P.S. Karaniwan sa mga artikulo ng ganitong uri ang may-akda ay nag-aalok ng ilang uri ng wrapper, alinman sa sinusubukang ipatupad ang class-object inheritance batay sa prototypic inheritance, o simpleng syntactic sugar para sa prototypic inheritance. Hindi ko ito sinasadya, dahil... Naniniwala ako na ang isang tao na nakakaunawa sa kahulugan ng artikulong ito ay maaaring magsulat ng anumang pambalot para sa kanyang sarili, at marami pang mga kawili-wiling bagay :)
Mga Tag: Magdagdag ng mga tag
Pagbati sa lahat ng nagbabasa ng publikasyong ito. Ngayon nais kong dalhin ka sa isang pangunahing kasangkapan ng wika - Mga bagay ng JavaScript. Ipaalala ko sa iyo na ang js ay cross-browser at gumagana sa lahat ng operating system (windows, mac os, atbp.). Hindi tulad ng object-oriented programming language, ang pagpapatupad ng mga object sa js ay malaki ang pagkakaiba sa karaniwang functionality at mga variation sa paggamit ng mga instance, halimbawa, sa C#.
Samakatuwid, pagkatapos basahin ang kasalukuyang artikulo, matututunan mo ang mga pangunahing tampok na nakikilala ng mga bagay sa script, matutunan kung paano sila malikha, mai-update at matanggal. Aanhin ko rin ang paksa ng mga katangian, pamamaraan at konstruktor, at pag-uusapan kapaki-pakinabang na mga utos at siyempre kaunti tungkol sa mana. Sa tingin ko oras na para magsimulang mag-aral!
Ano ang isang bagay sa JavaScript at anong mga kakayahan mayroon ito?
Sa js, ang mga object ay simpleng associative arrays (tinatawag din silang mga hash).
Ano ang isang associative array?
Ito ay isang istraktura ng data na nag-iimbak ng isang tiyak na dami ng impormasyong nauugnay at naglalarawan sa isang partikular na elemento. Ang lahat ng data ay nakaayos at magkakaugnay bilang "key => value".
Halimbawa, kailangan mong ilarawan ang mga kotse. Pagkatapos ay lumikha ka ng isang auto object at ilarawan ang mga katangian nito sa isang array. Nagpasya akong ilarawan ang paggawa ng kotse (pangalan), kulay nito (kulay) at gastos (presyo). Sa ibaba ay inilakip ko ang code para sa pagpapatupad ng inilarawang gawain.
| 1 2 3 4 5 | var avto = ( pangalan: "BMW 116i", kulay: "itim", presyo: 588000 ); |
var avto = ( pangalan: "BMW 116i", kulay: "itim", presyo: 588000 );
Dito makikita mo ang isang paraan upang lumikha ng isang bagay na tinatawag na "avto". Ang pangalan, kulay at presyo ay mga susi na maaaring gamitin sa pagsulat ng aplikasyon.
Nauna ako sa halimbawang ito, kaya ngayon tingnan natin ang lahat sa pagkakasunud-sunod.
Maaari kang lumikha ng isang bagay sa maraming paraan:
var auto = (); o var auto = bagong Bagay();
Sa parehong mga kaso, isang walang laman na bagay ang nilikha gamit ang sikat na pangalan, ngunit ang unang pagpipilian ay ginagamit nang mas madalas, dahil ito ay mas maikli at mas maginhawang magsulat.
Lahat tungkol sa mga ari-arian
Ngayon ay kailangan mong punan ang walang laman na bagay na may mga parameter. Upang gawin ito, kailangan mong magdagdag ng mga katangian, na tinawag ko ring mga susi sa itaas. Muli, mayroong dalawang paraan upang magdeklara ng mga ari-arian.
Gusto kong tandaan na ang JavaScript ay walang mahigpit na balangkas para sa paglikha at pagsisimula ng mga naturang parameter. Maaaring lumabas ang mga bagong property sa buong code, tulad ng pagtanggal at pag-update ng mga ito.
Kaya, maaari mong gawin ang lahat ng mga susi nang sabay-sabay o ipahayag ang mga ito kapag magagamit na ang mga ito. At kahit na, habang nagsusulat ng isang programa, sumangguni ka sa mga hindi umiiral na mga susi, walang magiging error. Sa kasong ito, ibabalik ang "undefined".
Unang paraan.
Paglikha at pag-access ng mga katangian gamit ang isang tuldok. Upang ipatupad ang pagpipiliang ito, kailangan mong isulat ang pangalan ng bagay, at pagkatapos ay idagdag ang pangalan ng susi dito sa pamamagitan ng isang tuldok at pagkatapos ay magtalaga ng ilang halaga sa pamamagitan ng pantay na tanda:
avto.name = “BMW 116i”
Ngunit sa paraang ito ay magdaragdag ka ng isa pang elemento sa umiiral na mga susi:
Ginagamit ang paraang ito kapag alam na ang pangalan ng property at kailangan mong gumawa ng ilang partikular na pagkilos gamit ang mga value.
Pangalawang paraan.
Walang pinagkaiba sa una, kung ihahambing mo ang kanilang mga layunin. Gayunpaman, ang pamamaraang ito ay may kaunting kalamangan. Para sa pagpipiliang ito, ginagamit ang mga square bracket:
avto[“pangalan”] = “BMW 116i”
Ang isang magandang karagdagan ay ang kakayahang lumikha ng mga pangalan ng ari-arian sa anyo ng anumang string. Halimbawa,
avto[“pangalan ng kotse”] = “BMW 116i”
Ang pagtatrabaho sa mga susi sa pamamagitan ng mga square bracket ay ginagamit kapag ang ilang mga parameter ay ipinasok ng gumagamit at naka-imbak sa mga variable o kapag ang mga pangalan ng mga katangian ay hindi alam nang maaga. Halimbawa, hinihiling ng user ang presyo ng napiling kotse. Ang elementong tinawag ay isinulat sa variable, at ang presyo ay ipinadala bilang tugon:
var auto = (); avto.name = "BMW_116i"; avto.price = 588000; var key = "presyo"; // ang presyo ng kotse ay hiniling na alerto(avto);
Ngayon ay lumipat tayo sa pagtanggal ng mga katangian. Napakasimple ng lahat dito. Upang alisin, gamitin ang command tanggalin. Kaya, kung idagdag mo ang sumusunod na 2 linya sa huling halimbawa sa ibaba:
tanggalin ang auto.price;
alerto(auto);
Pagkatapos, kapag tumatawag ng alerto sa pangalawang pagkakataon, ang dialog box ay magpapakita ng "hindi natukoy".
Ang ilang mga salita tungkol sa pagiging compactness
Sa kasalukuyang yugto, sinabi ko sa iyo kung paano lumikha ng isang bagay at ilarawan ang mga katangian nito. Naka-attach ako dito mga kaso ng pagsubok, gayunpaman, ang pinaka-matulungin sa inyo, mahal na mga mambabasa, ay napansin na ang unang code ng programa ay medyo naiiba sa lahat ng iba pa.
At lahat dahil gumagamit ito ng isang compact na representasyon ng data. Ito ay isang napaka-tanyag na paraan ng pagdedeklara ng mga susi dahil ito ay mas maikli sa pagsulat at mas madaling maunawaan nang biswal.
Dumaan tayo sa ating mga ari-arian
Sa JavaScript, maaari mong mabilis na umulit sa pamamagitan ng mga ginawang katangian. Para sa layuning ito, isang espesyal na mekanismo ang ibinigay, na mas kilala bilang ikot.
Kung pamilyar ka sa iba pang mga programming language, alam mo na kadalasang ginagawa ang mga loop gamit ang salita para sa, pagkatapos ay nakasulat sa panaklong ang kundisyon para sa pag-enumerate ng mga elemento.
Sa js ito ay nagpapaalala nito hitsura ikot foreach mula sa wikang C#. Tingnan ang pangkalahatang disenyo:
para sa (var obj sa object) ( // nagsasagawa ng paghahanap)
kung saan ang obj ay responsable para sa pangalan ng mga enumerated key,
bagay – para sa kanilang mga halaga.
At ngayon narito ang isang konkretong halimbawa para sa iyo.
| 1 2 3 4 5 6 7 8 | var avto = ( pangalan: "BMW 116i", kulay: "itim", presyo: 588000 ); para sa (var obj sa bagay) ( alerto(obj + ":" + object) ) |
var avto = ( pangalan: "BMW 116i", kulay: "itim", presyo: 588000 ); para sa (var obj sa bagay) ( alerto(obj + ":" + object) )
Panahon na upang maging pamilyar sa mga pamamaraan
Nagbibigay ang wika ng script para sa paglikha ng mga pamamaraan. Ito ay isang ganap na simpleng mekanismo kung saan sa anumang oras maaari kang magdagdag ng isang paraan o mga pamamaraan sa anumang bagay na nagpapalawak ng mga kakayahan ng nilikha na mga associative array. Tinatawag din silang mga katangian ng pag-andar.
Ang Js mismo ay napaka-dynamic at kamangha-manghang sa ilang lawak. Ito ay kung paano ka makakagawa ng mga elemento ng iba't ibang uri. Kapag nag-aaral ng wikang ito, hindi mo kailangang kabisaduhin ang mga kumplikadong istruktura, dahil maraming mga deklarasyon ang halos magkapareho sa bawat isa.
Kaya, upang lumikha ng isang paraan, kailangan mong magdeklara ng isang bagay, at pagkatapos ay simulan ang pagsusulat ng isang utos na eksaktong katulad ng paglikha ng mga katangian. Gayunpaman, pagkatapos ng “=” hindi na ang value ang isinulat, kundi ang keyword function (variable). At pagkatapos ay sa kulot na braces nakalista ang mga aksyon.
Narito ang pagpapatupad ng mekanismong ito:
var avto =() avto.name = “BMV” avto.year = 1999 avto.drive = function(k) ( alert(“Nakalipas ang sasakyan”+n+“ km.”)) avto.drive(300) avto. pagmamaneho( 450)
Tulad ng nakikita mo, ang halimbawang ito ay naglalaman ng mga katangian at pamamaraan na ang mga tawag ay sa una ay magkapareho.
May mga constructor din ba ang JS?
tama yan! Sa wikang ito, lahat ng gumagamit ng keyword na " bago", awtomatikong nagiging constructor. Kaya, sa itaas nakita mo ang deklarasyon ng isang walang laman na bagay sa anyo: avto = new Object ();. Ito ang tagabuo.
Para sa kalinawan, isaalang-alang ang mga linya sa ibaba.
var bob = bagong Bagay();
bob.name = "Bob Smith";
Gayunpaman, hindi ito ang buong arsenal ng mga posibilidad. Sa js, maaari kang lumikha ng iyong sariling mga konstruktor at pagkatapos ay gamitin ang mga ito upang magdeklara ng mga bagong bagay.
Kaya, gusto kong "gumawa" ng custom na constructor para sa mga umiiral nang kotse. Pakitandaan na ang pangalan ay dapat na naka-capitalize. Ito ang tanda ng mga pag-andar. Upang gawin ito, isinusulat ko ang sumusunod na pagpapatupad ng software:
function na Auto (pangalan, presyo) (
ito.pangalan = pangalan;
ito.presyo = presyo;
Ngayon, kapag gumawa ka ng walang limitasyong bilang ng mga bagay at inilapat ang constructor na ito sa kanila, lahat sila ay kabilang sa parehong klase. Halimbawa:
var car1 = bagong Avto("BMW", 650000);
var car2 = bagong Avto("Audi", 520000);
Bilang karagdagan dito, maaari kang lumikha ng mga pamamaraan sa loob ng constructor.
Mga tampok ng mana sa JavaScript
Karaniwan, sa maraming wika, ang pamana ay batay sa mga klase na maaaring magmana sa isa't isa. Pagkatapos ay maririnig mo ang mga expression tulad ng "klase ng ninuno", "klase ng bata", atbp.
Gayunpaman, sa js lahat ay naiiba. Ito ay kung saan ang mga bagay ay minana.
Ang lahat ng mana ay nakabatay sa panloob na link sa pagitan ng mga bagay, na kilala bilang isang "prototype". Kung idinagdag mo ang ".prototype" sa isang paraan gamit ang isang tuldok, at pagkatapos ay ilagay ang pangalan ng prototype, ang lahat ng mga bagay ng napiling paraan ay mamanahin mula sa prototype na ito.
Lumipat tayo sa isang halimbawa.
function Transport (pangalan) ( this.name = name this.canDrive = true ) var transport = bagong Transport ("avto") // gumawa ng transport object function Bike (pangalan) ( this.name = pangalan ) Bike.prototype = transport / / tukuyin na lahat ng bagong object ng klase na ito ay gagamit ng transport bike1 = new Bike ("for_sport") bike2= new Bike ("for_child") console.log(bike1.name) console.log(bike2.name) console .log (bike1.canDrive)
Dito na yata ako magtatapos. Sinabi ko sa iyo ang tungkol sa mga pangunahing aspeto ng isang scripting language. Gayunpaman, ito ay mababaw na kaalaman lamang. Sa susunod ay lalalim pa tayo. Samantala, huwag kalimutang sumali sa mga ranggo ng aking mga tagasuskribi at ibahagi ang link sa artikulo sa iyong mga kaibigan. Good luck!
paalam na!
Pinakamahusay na pagbati, Roman Chueshov
Basahin: 97 beses
