Wprowadzenie do konstruktora w JavaScript
Metoda konstruktora w JavaScript jest specjalną metodą używaną do tworzenia i inicjowania obiektów w klasie. Tak właśnie działa konstruktor w każdym języku programowania. Tym, co odróżnia konstruktora JavaScript od innych, jest swoboda pod względem składni. Aby to lepiej zrozumieć, po prostu otwórz narzędzia programistyczne przeglądarki (Ctrl / Cmd + Shift + C) i przejdź do karty Konsola w oknie narzędzi programistycznych.
Tak wygląda to w Chrome
To jest plac zabaw dla większości pojęć związanych z JavaScript. W tym artykule będziemy korzystać z tego placu zabaw.
Typy konstruktorów w JavaScript
W JavaScript są dwa typy konstruktorów
1. Wbudowane konstruktory
Są to łatwo dostępne konstruktory dostarczane w pakiecie ze środowiskiem wykonawczym. Użytkownik po prostu musi je wywołać i altówkę, praca jest skończona. Przykłady wbudowanych konstruktorów to Array, Date i Object.
2. Konstruktorzy zdefiniowani przez użytkownika
Są to konstruktory zadeklarowane i zdefiniowane przez programistę do użycia w całej aplikacji. Programista może również definiować właściwości i metody własnych typów niestandardowych. Są również znane jako niestandardowe konstruktory. Zgodnie z konwencją wszystkie konstruktory JavaScript mają wielkość liter. Ma to na celu poinformowanie osoby używającej ich, że tę funkcję należy wywołać przy użyciu nowego słowa kluczowego.
Jak działają konstruktory w JavaScript?
Zanim spojrzymy na składnię konstruktorów JavaScript, musimy zrozumieć bardzo podstawową koncepcję JavaScript -
- Klasa Object podsumowuje w kontekście tego artykułu, że każdy obiekt JavaScript jest tworzony przez konstruktor Object. Jeśli wartość podana podczas tworzenia obiektu jest zerowa lub niezdefiniowana, Konstruktor obiektów utworzy pusty obiekt. W przeciwnym razie utworzy obiekt typu zdefiniowanego podczas tworzenia obiektu.
- Ilekroć deklarowany jest nowy obiekt typu klasy, nowe słowo kluczowe zwraca odwołanie do nowo utworzonego obiektu. Dostęp do tego obiektu można uzyskać za pomocą tego słowa kluczowego wewnątrz konstruktora, aby zainicjować właściwości obiektu.
- Chociaż technicznie JavaScript nie ma żadnych klas, ale ma konstruktory i prototypy zapewniające podobną funkcjonalność. W ECMAScript 2015 pojęcie klas zostało wprowadzone w JavaScript. Był to po prostu składniowy dodatek do istniejącego dziedziczenia opartego na prototypach i nie dodał żadnej nowej funkcjonalności do języka.
Składnia i przykłady konstruktorów w JavaScript
1) Metoda konstruktora
Poniżej znajduje się metoda konstruktora. Ta metoda jest używana w prototypie klasy.
Składnia
constructor((arguments))( … )
Kod
class Employee(
constructor(id, name)(
this.id = id;
this.name = name;
))
var emp1 = new Employee(123, "John");
console.log(emp1.name);
Wynik:
2) Konstruktor obiektów (wbudowane konstruktory)
Konstruktor obiektów jest wywoływany bezpośrednio podczas tworzenia obiektu klasy Object. Tworzy to obiekt klasy Object, jeśli argumenty są puste lub niezdefiniowane. W przeciwnym razie tworzony jest obiekt typu podanych parametrów.
Składnia
new Object(( value ))
Lub
new Array(( value ))
Lub
new Date(( value ))
Lub
new String(( value ))
Lub
new Number(( value ))
Lub
new Boolean(( value ))
Lub
new Function(( value ))
Lub
new Error(( value ))
Lub
new RegExp(( value ))
i tak dalej…
Kod:
var name = new Object("John");
var age = new Object(28);
console.log("Name : "+name+" & Age : "+age);
Wynik:
3) Konstruktory tablic i dat
W podobny sposób konstruktory Array i Date mogą być również używane do tworzenia obiektów odpowiednich typów.
Kod:
var alphabets = new Array('Apple', 'Ball', 'Cat');
console.log(alphabets);
Wynik:
Kod:
var now = new Date();
console.log(now);
Wynik:
Kod:
var err = new Error("A user-defined error has occurred.");
console.log(err);
Wynik:
4) Niestandardowe konstruktory
Możemy również zadeklarować i zdefiniować własnych konstruktorów, które będą używane w naszej aplikacji. Przyjrzyjmy się, jak można to osiągnąć.
Składnia
function FunctionName((arguments))( … )
Kod
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);
Wynik:
Znaczenie nowego słowa kluczowego
Teraz możesz się zastanawiać, co jeśli nie użyję nowego słowa kluczowego? Czy mogę pominąć nowe słowo kluczowe? Cóż, mój przyjacielu, nie. Użycie nowego słowa kluczowego jest bardzo istotne.
- Konstruktory JavaScript są funkcjami regularnymi. Towarzyszy im nowe słowo kluczowe informujące silnik JavaScript, że nowy obiekt musi zostać zbudowany z podanymi właściwościami. Bez nowego słowa kluczowego po prostu tworzysz coraz więcej globalnych obiektów.
- Nowe słowo kluczowe zwraca odwołanie do nowo utworzonego obiektu. Następnie przechowujemy to odwołanie w zmiennej. Bez nowego słowa kluczowego obiekt jest tworzony, ale nie jest zwracane odwołanie do obiektu. Obiekt przyjmuje zasięg globalny. Jedynym odniesieniem do tego obiektu jest obiekt okna.
- Zmieszany? Pozwól nam lepiej zrozumieć przykłady. Ponownie rozważ powyższy przykład. Usunęliśmy nowe słowo kluczowe z deklaracji obiektowych. Wynik był wyjątkiem dla niezdefiniowanych zmiennych. Wynika to z faktu, że bez nowego słowa kluczowego odwołanie do nowo utworzonych obiektów nie zostało zwrócone, a zatem nie zostało zapisane w naszych zmiennych book1, book2 i book3. Gdy próbowaliśmy uzyskać dostęp do tych zmiennych w metodzie display book, zgłoszony został wyjątek.
Kod:
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);
Wynik:
W tym samym przykładzie, jeśli zmodyfikujemy metodę wyświetlania książki, aby uzyskać dostęp do obiektów przez zakres okna, otrzymamy nieoczekiwany wynik.
Kod:
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);
Wynik:
Teraz, jako ćwiczenie, przeprowadź małą burzę mózgów, aby dowiedzieć się, dlaczego otrzymujemy ten wynik!
Konstruktorzy bezpieczni dla lunety
Wbudowane konstruktory w JavaScript są konstruktorami bezpiecznymi w zakresie. Nie tworzą globalnych zmiennych, gdy są wywoływane bez nowego słowa kluczowego. W ten sposób obiekty te można bezpiecznie tworzyć z nowym słowem kluczowym lub bez niego.
Kod
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
)
Tak, ty też możesz tworzyć zdefiniowane przez użytkownika konstruktory bezpieczne. Kontynuuj, utwórz konstruktor bezpieczny dla naszych książek w powyższym przykładzie.
Wniosek
W tym artykule przedstawiono dokładną demonstrację konstruktorów JavaScript. Pomaga to również w zrozumieniu działania JavaScript. Kluczową rzeczą do zapamiętania jest to, że chociaż technicznie nie ma klas w JavaScript, metody i prototypy zapewniają podobną funkcjonalność do dyspozycji programisty. I tak, nowe słowo kluczowe jest ważne.
Polecane artykuły
To był przewodnik po Konstruktorze w JavaScript. Tutaj omawiamy jego typy i ważne metody z Jak stworzyć konstruktora bezpiecznego dla zakresu. Możesz również przejrzeć nasze artykuły, aby dowiedzieć się więcej-
- Co potrafi Javascript?
- Co to jest JavaScript?
- Jak zainstalować JavaScript
- Destructor w Javie
- Funkcje wyrażenia regularnego w języku Python (przykład)
- Przykłady tego słowa kluczowego
- Praca i reguły instanceOf w Javie z przykładem