Konstruktor v JavaScriptu - jeho typy a dovozní metody

Obsah:

Anonim

Úvod do konstruktoru v JavaScriptu

Metoda konstruktoru v JavaScriptu je speciální metoda používaná k vytváření a inicializaci objektů v rámci třídy. To dělá konstruktor v každém programovacím jazyce. To, co odlišuje konstruktor JavaScriptu od ostatních, je svoboda syntaxe. Abyste to lépe pochopili, jednoduše otevřete vývojové nástroje prohlížeče (Ctrl / Cmd + Shift + C) a v okně nástrojů pro vývojáře přejděte na kartu Konzola.

V prohlížeči Chrome to vypadá takto

Toto je hřiště pro většinu konceptů souvisejících s JavaScriptem. Toto hřiště bychom použili v tomto článku.

Typy konstruktorů v JavaScriptu

V JavaScriptu jsou dva typy konstruktérů

1. Vestavěné konstruktory

Jedná se o snadno dostupné konstruktory, které jsou dodávány s prováděcím prostředím. Uživatel je prostě musí vyvolat a viola, práce je hotová. Příklady vestavěných konstruktorů jsou pole, datum a objekt.

2. Konstruktory definované uživatelem

Jedná se o konstruktéry deklarované a definované programátorem pro použití v celé aplikaci. Programátor může také definovat vlastnosti a metody svých vlastních typů. Oni jsou také známí jako zakázkové konstruktéry. Podle konvencí jsou všichni konstruktéři JavaScriptu uvězněni. To znamená, že osoba, která je používá, musí tuto funkci vyvolat pomocí nového klíčového slova.

Jak konstruktéři pracují v JavaScriptu?

Než se podíváme na syntaxi konstruktérů JavaScriptu, musíme pochopit velmi základní koncept JavaScriptu -

  • Třída Object v kontextu tohoto článku shrnuje, že každý objekt JavaScript je vytvořen konstruktorem Object. Pokud je hodnota zadaná při vytváření objektu nulová nebo nedefinovaná, konstruktor objektu vytvoří prázdný objekt. Jinak vytvoří objekt typu definovaného při vytváření objektu.
  • Kdykoli je deklarován nový objekt typu třídy, nové klíčové slovo vrátí odkaz na nově vytvořený objekt. K tomuto objektu se přistupuje pomocí tohoto klíčového slova uvnitř konstruktoru k inicializaci vlastností objektu.
  • I když technicky JavaScript nemá žádné třídy, má konstruktéry a prototypy, které přinášejí podobnou funkčnost. V ECMAScript 2015 byl koncept tříd představen v JavaScriptu. To byl jednoduše syntaktický doplněk ke stávající dědičnosti založené na prototypech a nepřidal do jazyka žádné nové funkce.

Syntaxe a příklady konstruktoru v Javascriptu

1) Metoda konstruktoru

Níže je uvedena metoda konstruktoru. Tato metoda se používá uvnitř prototypu třídy.

Syntax

constructor((arguments))( … )

Kód

class Employee(
constructor(id, name)(
this.id = id;
this.name = name;
))
var emp1 = new Employee(123, "John");
console.log(emp1.name);

Výstup:

2) Konstruktor objektů (Vestavěné konstruktory)

Konstruktor Object je volán přímo, když je vytvořen objekt třídy Object. Tím se vytvoří objekt třídy Object, pokud jsou jako argumenty předány nulové nebo nedefinované parametry. Jinak se vytvoří objekt typu daných parametrů.

Syntax

new Object(( value ))

Nebo

new Array(( value ))

Nebo

new Date(( value ))

Nebo

new String(( value ))

Nebo

new Number(( value ))

Nebo

new Boolean(( value ))

Nebo

new Function(( value ))

Nebo

new Error(( value ))

Nebo

new RegExp(( value ))

a tak dále…

Kód:

var name = new Object("John");
var age = new Object(28);
console.log("Name : "+name+" & Age : "+age);

Výstup:

3) konstruktéři polí a dat

Podobně lze konstruktory Array a Date použít také k vytváření objektů příslušných typů.

Kód:

var alphabets = new Array('Apple', 'Ball', 'Cat');
console.log(alphabets);

Výstup:

Kód:

var now = new Date();
console.log(now);

Výstup:

Kód:

var err = new Error("A user-defined error has occurred.");
console.log(err);

Výstup:

4) Zakázkové konstruktory

Můžeme také prohlásit a definovat vlastní konstruktéry, které budou použity v celé naší aplikaci. Podívejme se, jak toho lze dosáhnout.

Syntax

function FunctionName((arguments))( … )

Kód

function Book(name, author, year) (
this.name = name;
this.author = author;
this.year = year;
)
function displayBook(book)(
console.log('\'' + book.name + '\' authored by ' + book.author + ' in the year ' + book.year + '.');
)
var book1 = new Book('Java - The Complete Reference', 'Herbert Schildt', 2006);
var book2 = new Book('Let Us C', 'Yashavant Kanetkar', 2002);
var book3 = new Book('Data Structures', 'Seymour Lipschutz', 2005);
displayBook(book1);
displayBook(book2);
displayBook(book3);

Výstup:

Význam nového klíčového slova

Nyní se možná ptáte, co když nepoužívám nové klíčové slovo? Mohu vynechat nové klíčové slovo? No, příteli, ne. Použití nového klíčového slova je velmi důležité.

  • Konstruktory JavaScriptu jsou běžné funkce. Jsou doprovázeny novým klíčovým slovem, které sdělí modulu JavaScript, že nový objekt musí být zkonstruován s danými vlastnostmi. Bez nového klíčového slova byste jednoduše vytvářeli stále více globálních objektů.
  • Nové klíčové slovo vrátí odkaz na nově vytvořený objekt. Tento odkaz pak uložíme do proměnné. Bez nového klíčového slova bude objekt vytvořen, ale nebude vrácen žádný odkaz na objekt. Objekt předpokládá globální rozsah. Jediný odkaz na tento objekt je prostřednictvím objektu window.
  • Zmatený? Podívejme se lépe na příklady. Zvažte výše uvedený příklad znovu. Z deklarací objektů jsme odstranili nové klíčové slovo. Výsledkem byla výjimka z nedefinovaných proměnných. Důvodem je, že bez nového klíčového slova se reference nově vytvořených objektů nevrátila, a proto nebyla uložena v našich proměnných book1, book2 a book3. Když jsme se pokusili získat přístup k těmto proměnným v metodě zobrazení knihy, vyvolá se výjimka.

Kód:

function Book(name, author, year) (
this.name = name;
this.author = author;
this.year = year;
)
function displayBook(book)(
console.log('\'' + book.name + '\' authored by ' + book.author + ' in the year ' + book.year + '.');
)
var book1 = Book('Java - The Complete Reference', 'Herbert Schildt', 2006);
var book2 = Book('Let Us C', 'Yashavant Kanetkar', 2002);
var book3 = Book('Data Structures', 'Seymour Lipschutz', 2005);
displayBook(book1);
displayBook(book2);
displayBook(book3);

Výstup:

Ve stejném příkladu, pokud upravíme metodu zobrazení knihy pro přístup k objektům prostřednictvím rozsahu okna, dostaneme neočekávaný výstup.

Kód:

function Book(name, author, year) (
this.name = name;
this.author = author;
this.year = year;
)
function displayBook(book)(
console.log('\'' + window.name + '\' authored by ' + window.author +' in the year ' + window.year + '.');
)
var book1 = Book('Java - The Complete Reference', 'Herbert Schildt', 2006);
var book2 = Book('Let Us C', 'Yashavant Kanetkar', 2002);
var book3 = Book('Data Structures', 'Seymour Lipschutz', 2005);
displayBook(book1);
displayBook(book2);
displayBook(book3);

Výstup:

Nyní jako cvičení udělejte trochu brainstormingu, abyste zjistili, proč dostáváme tento výstup!

Konstruktory bezpečné pro rozsah

Vestavěné konstruktory v JavaScriptu jsou konstruktéry bezpečné pro rozsah. Při volání bez nového klíčového slova nevytvářejí globálně zaměřené proměnné. Tyto objekty tedy lze bezpečně vytvářet s novým klíčovým slovem nebo bez něj.

Kód

function SampleFn(argument) (
// if "this" is not an instance of the constructor
// it means it was called without new
if (!(this instanceof SampleFn)) (
// call the constructor again with new
return new SampleFn(argument);
)
// The code to construct properties and methods
)

Ano, můžete také vytvořit uživatelem definované konstruktory bezpečné pro obor. Ve výše uvedeném příkladu vytvořte konstruktér pro naše knihy bezpečný obor.

Závěr

Tento článek poskytl podrobnou demonstraci konstruktorů JavaScriptu. To také pomáhá pochopit fungování JavaScriptu. Klíčovou věcí, kterou je třeba si pamatovat, je, že ačkoli technicky neexistují třídy v JavaScriptu, metody a prototypy poskytují vývojářům podobnou funkčnost. A ano, nové klíčové slovo je důležité.

Doporučené články

Toto byl průvodce Constructorem v JavaScriptu. Zde diskutujeme o jeho typech a důležitých metodách s tím, jak vytvořit konstruktéra bezpečného oboru. Prohlédněte si také uvedené články, abyste se dozvěděli více -

  1. Co dokáže Javascript?
  2. Co je to JavaScript?
  3. Jak nainstalovat JavaScript
  4. Destruktor v Javě
  5. Funkce Regex v Pythonu (příklad)
  6. Příklady tohoto klíčového slova
  7. Práce a pravidla instanceOf v Javě s příkladem