Madame Lelica

Johdanto

JavaScript on prototyyppi-pohjainen kieli, ja jokainen objekti JavaScript on piilotettu sisäinen ominaisuus nimeltä ] joita voidaan käyttää laajentaa objektin ominaisuuksia ja menetelmiä. Voit lukea lisää prototyyppien ymmärtämisestä prototyypit ja perintö JavaScript opetusohjelma.

viime aikoihin asti ahkerat kehittäjät käyttivät Constructorin toimintoja jäljitelläkseen Javascriptissä oliopainotteista suunnittelumallia., Kieliluokituksessa ECMAScript 2015, josta käytetään usein nimitystä ES6, otettiin käyttöön luokat JavaScript-kielelle. Luokat JavaScript ei oikeastaan tarjoavat ylimääräisiä toimintoja, ja on usein kuvattu tarjoamalla ”syntaktisia sokeria” yli prototyyppejä ja perintö, että ne tarjoavat puhtaampaa ja enemmän elegantti syntaksi. Koska muut ohjelmointikielet käyttävät luokkia, JavaScriptin luokkasyntaksi tekee kehittäjille helpommaksi siirtyä kielten välillä.

luokat ovat funktioita

JavaScript-luokka on funktion tyyppi., Luokat ilmoitetaan class avainsanalla. Käytämme funktion lauseke syntaksi alustaa funktion ja luokan lauseke syntaksi alustaa luokan.

// Initializing a function with a function expressionconst x = function() {}

// Initializing a class with a class expressionconst y = class {}

voidaan käyttää ] objektin Object.getPrototypeOf() menetelmä. Kokeillaan sillä luomaamme tyhjää funktiota.

Object.getPrototypeOf(x);

Output
ƒ () { }

Voimme myös käyttää tätä menetelmää luokan me juuri luonut.,

Object.getPrototypeOf(y);

Output
ƒ () { }

koodi julisti function ja class molemmat paluu toiminto ]. Prototyypeillä mikä tahansa funktio voi muuttua konstruktoriseksi instanssiksi käyttäen new – avainsanaa.

Output
x {}constructor: ƒ ()

Tämä koskee myös luokkia.

Output
y {}constructor: class

Nämä prototyypin rakentaja esimerkkejä ovat muuten tyhjä, mutta voimme nähdä, miten alla syntaksi, molemmat menetelmät ovat saavuttaa sama lopputulos.,

, jossa Määritellään Luokka

prototyyppejä ja perintö opetusohjelma, olemme luoneet esimerkki perustuu noin merkin luominen teksti-pohjainen roolipeli. Jatketaan tästä esimerkistä, jolla voit päivittää syntaksin funktioista luokkiin.

rakentaja toiminto on alustettu parametrien määrä, joka olisi määrätty ominaisuudet this viitaten toiminto itse. Tunnisteen ensimmäinen kirjain pääomitettaisiin yleissopimuksella.

// Initializing a constructor functionfunction Hero(name, level) { this.name = name; this.level = level;}

Kun me kääntää tämän luokan syntaksi, alla, me näemme, että se on rakenteeltaan hyvin samalla tavalla.

// Initializing a class definitionclass Hero { constructor(name, level) { this.name = name; this.level = level; }}

– tiedämme, että on rakentaja toiminto on tarkoitettu esine suunnitelma, jonka arvo ensimmäinen kirjain alustajan (joka on valinnainen) ja sitä kautta perehtyneisyys syntaksi. class avainsana viestii suoraviivaisemmin funktiomme tavoitteesta.,

ainoa ero syntaksi alustus on käyttää class avainsanan sijaan function, ja määrittämällä ominaisuuksia sisälle constructor() menetelmä.

Määritellään Menetelmät

yleinen käytäntö, jossa rakentaja toiminnot on määrittää menetelmät suoraan prototype sen sijaan, että alustuksen, kuten nähdään greet() menetelmä alla.

luokilla tämä syntaksi yksinkertaistuu, ja menetelmä voidaan lisätä suoraan luokkaan., ES6: ssa esitettyä menetelmän määritelmää käyttäen menetelmän määrittely on vielä suppeampi prosessi.

katsotaanpa näitä ominaisuuksia ja menetelmiä toiminnassa. Luomme uuden esiintymän Hero käyttäen new avainsana, ja määrittää joitakin arvoja.

const hero1 = new Hero('Varg', 1);

Jos me tulostaa enemmän tietoja meidän uusi kohde, jossa console.log(hero1), voimme nähdä enemmän yksityiskohtia siitä, mitä on tapahtumassa luokan alustus.,

Output
Hero {name: "Varg", level: 1}__proto__: ▶ constructor: class Hero ▶ greet: ƒ greet()

– Voimme nähdä, että lähtö constructor() ja greet() toiminnot sovellettiin __proto__ tai ] ja hero1, ja ei suoraan menetelmää hero1 objekti. Vaikka tämä on selvää, kun tehdään constructor toimintoja, se ei ole selvää, kun luodaan luokkia. Luokat mahdollistavat yksinkertaisemman ja ytimekkäämmän syntaksin, mutta uhraavat jonkin verran selkeyttä prosessissa.,

Jatkamisesta Luokka

edullinen ominaisuus rakentaja toimintoja ja luokat on, että ne voidaan laajentaa uusiin kohteen piirustuksia perustuu pois vanhemman. Tämä estää koodin toistamisen esineille, jotka ovat samankaltaisia, mutta tarvitsevat joitakin muita tai tarkempia ominaisuuksia.

Uusi rakentaja toimintoja voidaan luoda vanhemman käyttäen call() menetelmä., Alla olevassa esimerkissä luomme enemmän erityisluonnetta luokan nimeltä Mage, ja määrittää ominaisuudet Hero käyttäen call(), sekä lisäämällä ylimääräinen omaisuus.

tässä vaiheessa, voimme luoda uusia esimerkiksi Mage käyttäen samoja ominaisuuksia kuin Hero sekä uuden lisäsimme.,

const hero2 = new Mage('Lejon', 2, 'Magic Missile');

Lähettää hero2 konsoli, voimme nähdä, olemme luoneet uuden Mage perustuu pois rakentaja.

Output
Mage {name: "Lejon", level: 2, spell: "Magic Missile"}__proto__: ▶ constructor: ƒ Mage(name, level, spell)

Kanssa ES6 luokat, super avainsana on käyttää paikka call käyttää emoyhtiön toiminnot. Käytämme extends viittaamaan vanhempainluokkaan.

Nyt voimme luoda uuden Mage esimerkiksi samalla tavalla.,

const hero2 = new Mage('Lejon', 2, 'Magic Missile');

Me tulostaa hero2 konsoliin ja tarkastella tuotos.

Output
Mage {name: "Lejon", level: 2, spell: "Magic Missile"}__proto__: Hero ▶ constructor: class Mage

lähtö on lähes täsmälleen sama, paitsi että luokan rakentaminen ] liittyy vanhemman, tässä tapauksessa Hero.

Alla on side-by-side vertailu koko prosessin alustuksen, lisäämällä menetelmiä, ja perintö on rakentaja toiminto ja luokka.

vaikka syntaksi on aivan erilainen, lopputulos on lähes sama molempien menetelmien välillä. Luokat antavat meille suppeamman tavan luoda objektin pohjapiirustuksia, ja konstruktiofunktiot kuvaavat tarkemmin, mitä konepellin alla tapahtuu.

päätelmä

tässä opetusohjelmassa opimme yhtäläisyyksistä ja eroista JavaScript constructor-toimintojen ja ES6-luokkien välillä. Molemmat luokat ja rakentajien matkia olio-perintö malli JavaScript, joka on prototyyppi-pohjainen perintö kieli.,

prototyyppisen perinnön ymmärtäminen on ensiarvoisen tärkeää tehokkaaksi JavaScript-kehittäjäksi. On perehtynyt luokat on erittäin hyödyllinen, koska suosittu JavaScript-kirjastot, kuten Reagoida tehdä usein käyttää class – syntaksilla.