Pochopení konstruktorů v JavaScriptu

JavaScript je zavedený jazyk, ale přidal pouze podporu pro klasické objektově orientované programování (OOP) v ES6. Dokud JavaScript nepřidal funkce jako deklarace tříd, zpracovával OOP pomocí méně známého paradigmatu založeného na prototypech. S oběma přístupy však můžete vytvářet složité aplikace, které využívají objektově založené funkce.

Konstruktor v prototypovém JavaScriptu vypadá podobně jako jakákoli jiná funkce. Hlavní rozdíl je v tom, že tuto funkci konstruktoru můžete použít k vytváření objektů.

Co je konstruktor v JavaScriptu?

Konstruktéři jsou jedním z základní pojmy v objektově orientovaném programování. Konstruktor je funkce, kterou můžete použít k vytvoření instance objektu. Kromě vytvoření nového objektu konstruktor specifikuje vlastnosti a chování, které k němu budou patřit.

Syntaxe konstruktoru

funkceNameOfConstructor() {
 tato.vlastnost1 = "Vlastnost1";
 tato.vlastnost2 = "Vlastnost2";
 tato.vlastnost3 = "Vlastnost3";
}

Můžete vytvořit konstruktor pomocí funkce klíčové slovo, protože je v podstatě jako každá jiná funkce. Konstruktéři však dodržují následující konvence:

1. Chcete-li je odlišit od ostatních funkcí, použijte název svého konstruktoru, který začíná velkým písmenem.
2. Konstruktéři používají tento klíčové slovo jinak. Uvnitř konstruktéra, tento odkazuje na nový objekt, který konstruktor vytvoří.
3. Na rozdíl od funkcí JavaScriptu konstruktory definují vlastnosti a chování namísto vracení hodnot.

Použití konstruktoru k vytváření nových objektů

V JavaScriptu je použití konstruktoru k vytvoření objektu snadný úkol. Zde je jednoduchý konstruktor s následným vyvoláním:

funkceStudent() {
 toto.jméno = "Gloria";
 toto.pohlaví = "ženský";
tento.věk = 19;
}
nechat studentka = Nový Student();

V tomto příkladu studentka je objekt vytvořený z Student konstruktér. Použijte Nový klíčové slovo pro volání funkce jako konstruktoru. Toto klíčové slovo říká JavaScriptu, aby vytvořil novou instanci Student. Tuto funkci byste neměli volat bez Nový klíčové slovo, protože tento uvnitř konstruktoru nebude ukazovat na nový objekt. Po výstavbě, studentka má všechny vlastnosti Student. K těmto vlastnostem můžete přistupovat a upravovat je stejně jako u jakéhokoli jiného objektu.

Důležité věci, které byste měli vědět o konstruktorech JavaScriptu

Práce s konstruktéry může být tak únavná a zároveň to může být snadný úkol. Zde je několik důležitých věcí, které by měl každý vývojář vědět o práci s konstruktory.

Použití konstruktorů s argumenty

Konstruktor můžete rozšířit tak, aby přijímal argumenty. To je velmi důležité, pokud chcete psát citlivý a flexibilní kód.

Kdykoli vytvoříte objekt z konstruktoru, objekt zdědí všechny vlastnosti deklarované v konstruktoru. Například, studentka vytvořený výše bude mít vlastnosti název, Rod, a stáří s pevnými počátečními hodnotami. I když můžete každou vlastnost změnit ručně, dalo by to hodně práce, kdybyste psali program využívající mnoho objektů.

Naštěstí konstruktéři JavaScriptu mohou přijímat parametry, jako každá jiná funkce. Můžete změnit Student konstruktor pro akceptování dvou parametrů:

funkceStudent(jméno, pohlaví) {
tento.jméno = jméno;
tento.gender = pohlaví;
tento.věk = 19;
}

Nyní můžete definovat jedinečné objekty ze stejného konstruktoru předáním různých argumentů.

Argumenty dělají konstruktéry flexibilnějšími. Šetří čas a podporují čistý kód.

Definování objektových metod

Metoda je vlastnost objektu, která je funkcí. Metody vylepšují váš kód v OOP, protože k vašim objektům přidávají různá chování. Zde je příklad:

funkceStudent(jméno, pohlaví) {
tento.jméno = jméno;
tento.gender = pohlaví;
tento.věk = 19 ;
tento.sayName = funkce () {
vrátit se„Jmenuji se ${name}`; 
 }
}

Výše uvedené přidává funkci řekni jméno ke konstruktérovi.

Předpokládejme, že použijete tento konstruktor k vytvoření objektu, který uložíte do proměnné, studentka. Tuto funkci pak můžete zavolat pomocí kódu níže:

studentka.sayName()

prototyp

Dříve jsme tvořili Student způsobem, že všechny jeho instance budou mít příponu stáří nemovitost s hodnotou 19. Výsledkem bude duplicitní proměnná pro každou z nich Student instance, kterou vytvoříte.

Aby se zabránilo této duplicitě, používá JavaScript koncept prototypů. Všechny objekty vytvořené z konstruktoru sdílejí vlastnosti jeho prototypu. Můžete přidat stáří majetek do Student prototyp, jak je znázorněno níže:

Student.prototyp.věk = 19;

Tímto způsobem budou všechny případy Student bude mít stáří vlastnictví. Prohlašování vlastnosti prototypu je způsob, jak snížit duplicitní kód ve vaší aplikaci. Díky tomu je váš kód co nejstandardnější.

Prototypovou vlastností může být objekt

Vlastnosti prototypu můžete přidat jednotlivě, jak je vysvětleno výše. Pokud však potřebujete přidat mnoho vlastností, může to být nepohodlné.

Alternativně můžete v novém objektu obsahovat všechny požadované vlastnosti. Tímto způsobem nastavíte všechny vlastnosti najednou. Například:

Student.prototype = {
 věk: 19,
 závod: "Bílý",
 postižení: "Žádný"
}

Student.prototype = { 
konstruktér: student, 
 věk: 19, 
 závod: "Bílý", 
 postižení: "Žádný"
}

Supertypy a dědičnost

Dědictví je metoda, kterou programátoři používají ke snížení chyb ve svých aplikacích. Je to způsob, jak se držet Neopakuj se (SUCHÉ) zásada.

Předpokládejme, že máte dva konstruktory –Student a Učitel— které mají dvě podobné vlastnosti prototypu.

Student.prototype = { 
konstruktér: student,
sayName: funkce () {
vrátit se„Jmenuji se ${name}`; 
 }
}
Teacher.prototype = { 
konstruktér: Učitel,
sayName: funkce () {
vrátit se„Jmenuji se ${name}`;
 }
}

Oba tyto konstruktéry definují řekni jméno metoda, stejně. Abyste se vyhnuli této zbytečné duplicitě, můžete vytvořit a supertyp.

funkceIndividuální detaily(){};
IndividualDetails.prototype = { 
konstruktér: Individuální podrobnosti, 
sayName: funkce () {
vrátit se„Jmenuji se ${name}`; 
 }
};

Poté můžete odstranit řekni jméno od obou konstruktérů.

Chcete-li zdědit vlastnosti z nadtypu, použijte Object.create(). Prototyp obou konstruktorů nastavíte na instanci nadtypu. V tomto případě nastavíme Student a Učitel prototypy do instance IndividualDetails.

Tady je to:

Student.prototyp = Objekt.vytvořit (IndividualDetails.prototype);
Učitel.prototyp = Objekt.vytvořit (IndividualDetails.prototype);

Tím, Student a Učitel zdědit všechny vlastnosti nadtypu, Individuální detaily.

Takto se dá cvičit DRY v OOP pomocí supertypů.

Konstruktéři mění hru

Konstruktory jsou klíčovou součástí JavaScriptu a zvládnutí jejich funkčnosti je klíčové pro vývoj OOP JavaScript aplikací. K vytvoření objektů, které sdílejí vlastnosti a metody, můžete použít konstruktor. K definování hierarchií objektů můžete také použít dědičnost.

V ES6 můžete použít třída klíčové slovo pro definici klasických objektově orientovaných tříd. Tato verze JavaScriptu také podporuje a konstruktér klíčové slovo.