JavaScript Об’єкти
Реальні об’єкти, властивості та методи
У реальному житті автомобіль — це об’єкт.
Автомобіль має такі властивості, як вага та колір, і методи, як-от старт і зупинка:
| Об’єкт | Властивості | Методи |
|---|---|---|
|
car.name = Fiat car.model = 500 car.weight = 850kg car.color = white |
car.start() car.drive() car.brake() car.stop() |
Усі автомобілі мають однакові властивості, але значення властивості відрізняються від автомобіля до автомобіля.
Усі автомобілі мають однакові методи, але методи виконуються в різний час.
JavaScript Об’єкти
Ви вже дізналися, що змінні JavaScript є контейнерами для значень даних.
Цей код присвоює просте значення (Fiat) змінній з назвою car:
let car = "Fiat";
Спробуйте самі »
Об’єкти також є змінними. Але об’єкти можуть містити багато значень.
Цей код присвоює багато значень (Fiat, 500, білий) змінній під назвою car (автомобіль):
const car = {type:"Fiat", model:"500", color:"white"};
Спробуйте самі »
Значення записуються як пари ім’я:значення (ім’я та значення розділені двокрапкою).
Поширеною практикою є оголошення об’єктів за допомогою ключового слова const.
Докладніше про використання const з об’єктами в розділі: JS Const.
Визначення об’єкта
Ви визначаєте (і створюєте) об’єкт JavaScript за допомогою літералу об’єкта:
Приклад
const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
Спробуйте самі »
Пробіли та розриви рядків не важливі. Визначення об’єкта може займати кілька рядків:
Приклад
const person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
Спробуйте самі »
Властивості об’єкта
Пари імя:значення в JavaScript об’єктах називаються властивостями:
| Властивість | Значення властивості |
|---|---|
| firstName | John |
| lastName | Doe |
| age | 50 |
| eyeColor | blue |
Доступ до властивостей об’єкта
Ви можете отримати доступ до властивостей об’єкта двома способами:
objectName.propertyName
or
objectName["propertyName"]
JavaScript об’єкти – це контейнери для іменованих значень, які називаються властивостями.
Методи об’єктів
Об’єкти також можуть мати методи.
Методи — це дії, які можна виконувати над об’єктами.
Методи зберігаються у властивостях як визначення функцій.
| Властивість | Значення властивості |
|---|---|
| firstName | John |
| lastName | Doe |
| age | 50 |
| eyeColor | blue |
| fullName | function() {return this.firstName + " " + this.lastName;} |
Метод — це функція, яка зберігається як властивість.
Приклад
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
У прикладі вище this посилається на person object.
I.E. this.firstName означає властивість firstName для this.
I.E. this.firstName означає властивість firstName для person.
Що таке this?
В JavaScript ключове слово this відноситься до об’єкту.
Який об’єкт залежить від того, як this викликається (використовується або називається).
Ключове слово this відноситься до різних об’єктів залежно від способу його використання:
У методі об’єкта this відноситься до об’єкта. |
Окремо this відноситься до глобального об’єкта. |
У функції this відноситься до глобального об’єкта. |
У функції, у строгому режимі, this є undefined. |
У події this відноситься до елемента, який отримав подію. |
Такі методи, як call(), apply() та bind() можуть відносити this до будь-якого об’єкта. |
Примітка
this не є змінною. Це ключове слово. Ви не можете змінити значення this.
Ключове слово this
У визначенні функції this відноситься до "власника" функції.
У наведеному вище прикладі this є person object який "володіє" fullName функцією.
Іншими словами, this.firstName означає firstName властивість об’єкту this.
Дізнатись більше про this можна в розділі JavaScript this на нашому сайті W3Schools українською.
Доступ до методів об’єктів
Ви отримуєте доступ до методу об’єкта за допомогою такого синтаксису:
objectName.methodName()
Якщо отримати доступ до методу без круглих дужок (), він поверне визначення функції:
Не оголошуйте рядки, числа та логічні значення як об’єкти!
Коли змінну JavaScript оголошено за допомогою ключового слова "new", змінна створюється як об’єкт:
x = new String(); // Оголошує x як об’єкт String
y = new Number(); // Оголошує y як об’єкт Number
z = new Boolean(); // Оголошує z як об’єкт Boolean
Уникайте об’єктів String, Number та Boolean . Вони ускладнюють ваш код і сповільнюють швидкість виконання.
Ви дізнаєтеся більше про об’єкти пізніше в цьому підручнику.
