Konstruktory obiektów JavaScript
Przykład
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
}
Dobrą praktyką jest nazywanie funkcji konstruktora wielką literą.
Typy obiektów (plany) (klasy)
Przykłady z poprzednich rozdziałów są ograniczone. Tworzą tylko pojedyncze obiekty.
Czasami potrzebujemy „ planu ” do stworzenia wielu obiektów tego samego „typu”.
Sposobem na utworzenie „typu obiektu” jest użycie funkcji konstruktora obiektów .
W powyższym przykładzie function Person()jest funkcją konstruktora obiektów.
Obiekty tego samego typu tworzy się przez wywołanie funkcji konstruktora ze newsłowem kluczowym:
const myFather = new Person("John", "Doe", 50, "blue");
const myMother = new Person("Sally", "Rally", 48, "green");
To słowo kluczowe
W JavaScript wywoływaną rzeczą thisjest obiekt, który jest „właścicielem” kodu.
Wartością this, gdy jest używana w obiekcie, jest sam obiekt.
W konstruktorze funkcja thisnie ma wartości. Jest substytutem nowego obiektu. Wartość thiszostanie przypisana do nowego obiektu po utworzeniu nowego obiektu.
Zauważ, że thisto nie jest zmienna. To słowo kluczowe. Nie możesz zmienić wartości this.
Dodawanie właściwości do obiektu
Dodanie nowej właściwości do istniejącego obiektu jest łatwe:
Przykład
myFather.nationality = "English";
Właściwość zostanie dodana do myFather. Nie dla mojej Matki. (Nie do żadnych innych obiektów).
Dodawanie metody do obiektu
Dodanie nowej metody do istniejącego obiektu jest łatwe:
Przykład
myFather.name = function () {
return this.firstName + " " + this.lastName;
};
Metoda zostanie dodana do myFather. Nie dla mojej Matki. (Nie do żadnych innych obiektów).
Dodawanie właściwości do konstruktora
Nie możesz dodać nowej właściwości do konstruktora obiektów w taki sam sposób, w jaki dodajesz nową właściwość do istniejącego obiektu:
Przykład
Person.nationality = "English";
Aby dodać nową właściwość do konstruktora, musisz dodać ją do funkcji konstruktora:
Przykład
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
this.nationality = "English";
}
W ten sposób właściwości obiektu mogą mieć wartości domyślne.
Dodawanie metody do konstruktora
Twoja funkcja konstruktora może również definiować metody:
Przykład
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
this.name = function() {
return this.firstName + " " + this.lastName;
};
}
Nie można dodać nowej metody do konstruktora obiektów w taki sam sposób, w jaki dodaje się nową metodę do istniejącego obiektu.
Dodawanie metod do konstruktora obiektów musi odbywać się wewnątrz funkcji konstruktora:
Przykład
function Person(firstName, lastName, age, eyeColor) {
this.firstName = firstName;
this.lastName = lastName;
this.age = age;
this.eyeColor = eyeColor;
this.changeName = function (name) {
this.lastName = name;
};
}Funkcja changeName() przypisuje wartość name do właściwości lastName osoby.
Teraz możesz spróbować:
myMother.changeName("Doe");
JavaScript wie, o której osobie mówisz, "zastępując " to myMother .
Wbudowane konstruktory JavaScript
JavaScript ma wbudowane konstruktory dla obiektów natywnych:
new String() // A new String object
new Number() // A new Number object
new Boolean() // A new Boolean object
new Object() // A new Object object
new Array() // A new Array object
new RegExp() // A new RegExp object
new Function() // A new Function object
new Date() // A new Date object
Obiekt Math()nie znajduje się na liście. Mathjest obiektem globalnym. Nie newmożna użyć słowa kluczowego na
Math.
Czy wiedziałeś?
Jak widać powyżej, JavaScript ma wersje obiektowe prymitywnych typów danych String, Numberi Boolean. Ale nie ma powodu, aby tworzyć złożone obiekty. Prymitywne wartości są znacznie szybsze:
Użyj literałów ciągów ""zamiast new String().
Użyj literałów liczbowych 50zamiast new Number().
Użyj literałów logicznych true / falsezamiast new Boolean().
Użyj literałów obiektowych {}zamiast new Object().
Użyj literałów tablicowych []zamiast new Array().
Użyj literałów wzorca /()/zamiast new RegExp().
Użyj wyrażeń funkcyjnych () {}zamiast new Function().
Przykład
let x1 = ""; // new primitive string
let x2 = 0; // new primitive number
let x3 = false; // new primitive boolean
const x4 = {}; // new Object object
const x5 = []; // new Array object
const x6 = /()/ // new RegExp object
const x7 = function(){}; // new function
Obiekty strunowe
Normalnie łańcuchy są tworzone jako prymitywy:firstName = "John"
Ale łańcuchy można również tworzyć jako obiekty za pomocą newsłowa kluczowego:
firstName = new String("John")
Dowiedz się, dlaczego stringi nie powinny być tworzone jako obiekt w rozdziale JS Strings .
Liczba obiektów
Zwykle liczby są tworzone jako prymitywy:x = 30
Ale liczby można również tworzyć jako obiekty za pomocą newsłowa kluczowego:
x = new
Number(30)
Dowiedz się, dlaczego liczby nie powinny być tworzone jako obiekt w rozdziale Liczby JS .
Obiekty logiczne
Normalnie wartości logiczne są tworzone jako prymitywy:x =
false
Ale wartości logiczne można również tworzyć jako obiekty za pomocą newsłowa kluczowego:
x = new Boolean(false)
Dowiedz się, dlaczego wartości logiczne nie powinny być tworzone jako obiekty w rozdziale JS Booleans .