Prototip moștenire în JavaScript

Pentru a începe, să scrie o funcție normală

Ea ne întoarce la un obiect nou, care este o instanta a unei clase.

Constructorii în Javacript scrise cu o scrisoare de capital, pentru a le distinge cu ușurință de la funcțiile normale.

Deci, să ne amintim cu tine următoarele concepte. Tot ceea ce vom descrie este numită o clasă. funcția pe care o numim nou operator - este numit un constructor (de exemplu, piesa noastră este un designer), ceea ce primim de la un apel la noi - este o instanta a unei clase.

Să creeze două instanțe ale claselor de cale, care va lua parametrii de intrare în forma de proprietate.

Dacă vom obține track01 și track02 consola - vom vedea că am creat două obiect gol.

Acum, să adăugăm în argumentul constructorului params și de ieșire-l la consola

După cum putem vedea în consola - am trecut parametru în constructor și putem continua să lucreze cu ei. Această variabilă în interiorul constructorului este contextul instanță și câmpuri de instanță poate obraschatsya prin punct. Prin urmare, putem atribui this.name și this.url, astfel încât acestea să fie disponibile în cazul nostru.

Acum, dacă vom actualiza pagina putem vedea că vom crea o instanță a pistei de clasă cu câmpuri completate în numele și adresa URL.

Acum putem trata cazuri de domenii, de exemplu, track01.name sau track01.url.

Acum, să ne descrie o metodă playTrack, fiecare instanță a clasei poate juca.

Dacă încercăm să aducem acest lucru în cadrul playTrack metoda, putem vedea că acest lucru este o instanta a clasei noastre.

Putem, de exemplu, scrie this.name pentru a afișa numele piesei.

Acum, să numim

După cum putem vedea, am adus la consola

Dacă noi numim această metodă pe a doua pistă, obținem

Metoda de clasă Alibaba poate nu numai în constructor, așa cum tocmai am făcut, dar, de asemenea, prin proprietate prototip.

Dacă încercăm să rulați codul nostru, putem vedea că funcționează exact în același mod.

Care este diferența? Singura diferență este că, atunci când metoda este declarată un prototip prin intermediul, mai degrabă decât în ​​interiorul constructorului, putem trece peste.

Dacă vom scrie în consola

ne va conduce la funcția playTrack obiect în interior.

În OOP, suntem cu siguranță, sunt interesați de moștenire. Să ne imaginăm că avem nevoie de o YoutubeTrack de clasă, care are o imagine câmp suplimentar și moștenit de la clasa Track.

Ne dorim ca designerul nostru YoutubeTrack realizat tot aceeași logică ca și cea a Track doar cu modificări minore. Pentru a face acest lucru, vom folosi metoda se aplică. Pentru a determina Track Designer interior YoutubeTrack a scrie

Ce face? Aplicare cauze funcția Track (în acest caz, proiectantul), transferul de context, acest, adică YoutubeTrack context și să treacă toate argumentele care vor fi transmise la YoutubeTrack nostru.

Să ne derive în consola youtubeTrack01 și youtubeTrack02

Vedem că totul funcționează exact același nume și adresa URL apar ca un câmp de obiecte în consola pe care le zasetilis de Track Designer.

Dacă ne zakomentiruem codul Track.apply, vom vedea că avem de a crea un obiect gol.

Acum vrem să adăugați un alt câmp la YoutubeTrack. Numiți-o imagine.

Doar atunci când creați instanțe ale clasei YoutubeTrack adăuga o imagine

După cum vedem acum în consola am afișată imaginea chiar și în obiectul YoutubeTrack.

Acum vrem să vedem toate metodele care sunt disponibile pentru noi în clasa Track, acestea au fost, de asemenea, disponibile în YoutubeTrack.

După cum se poate vedea, în instanțele de cale avem functia playTrack si dorim ca acesta să fie disponibil în YoutubeTrack.

Pentru a face acest lucru, trebuie să pună în aplicare moștenire.

Noi atribuie YoutubeTrack.prototype obiect pe care le creați cu Track.prototype.

După cum putem vedea în consolă, avem o metodă în specimene playTrack YoutubeTrack

Acum putem determina cu ușurință

și va fi scris

Dar există un dezavantaj. Dacă vom scrie în consola

vedem aici nu este un constructor youtubeTrack, și Track Designer. Cum să-l repara?

Astfel, ne întoarcem un link înapoi la proiectant YoutubeTrack ca avem nevoie. Acum, dacă ne uităm în consolă, atunci vom apela constructorul din dreapta.

După cum putem vedea acum că toate instanțele clasei au metoda playTrack și dacă avem nevoie să - putem trece peste.

Acum putem apela o metodă de care avem nevoie.