6.1 Створення об'єктів
Об'єкти є одним з основних типів даних у JavaScript і широко використовуються для зберігання та управління даними. Об'єкт — це колекція властивостей, де кожна властивість складається з ключа (імені) та значення. У цій лекції ми розглянемо створення об'єктів, а також доступ до їх властивостей та методів.
1. Літерал об'єкта
Найпоширеніший спосіб створення об'єкта у JavaScript — використання літерала об'єкта.
У цьому прикладі ми створили об'єкт person з чотирма властивостями: name, age, isStudent та greet.
let person = {
name: 'John',
age: 30,
isStudent: false,
greet: function() {
return 'Привіт!';
}
};
2. Конструктор Object
Об'єкти також можуть бути створені за допомогою конструктора Object().
Цей спосіб еквівалентний створенню об'єкта за допомогою літерала об'єкта, але більш багатослівний:
let person = new Object();
person.name = 'John';
person.age = 30;
person.isStudent = false;
person.greet = function() {
return 'Привіт!';
};
3. Функція-конструктор
Функція-конструктор дозволяє створювати кілька екземплярів об'єктів з однаковими властивостями та методами.
У цьому прикладі функція-конструктор Person() використовується для створення об'єктів john і jane з однаковими властивостями та методами:
function Person(name, age, isStudent) {
this.name = name;
this.age = age;
this.isStudent = isStudent;
this.greet = function() {
return 'Привіт!';
};
}
let john = new Person('John', 30, false);
let jane = new Person('Jane', 25, true);
4. Метод Object.create()
Метод Object.create() створює новий об'єкт із вказаним прототипом та властивостями.
У цьому прикладі об'єкт john створюється на основі прототипу personPrototype:
let personPrototype = {
greet: function() {
return 'Привіт!';
}
};
let john = Object.create(personPrototype);
john.name = 'John';
john.age = 30;
john.isStudent = false;
6.2 Доступ до властивостей та методів
1. Доступ за допомогою крапки
Найпоширеніший спосіб доступу до властивостей та методів об'єкта — через крапку:
let person = {
name: 'John',
age: 30,
greet: function() {
return 'Привіт!';
}
};
console.log(person.name); // Виведе: John
console.log(person.age); // Виведе: 30
console.log(person.greet()); // Виведе: Привіт!
2. Доступ за допомогою квадратних дужок
Властивості об'єкта також можуть бути доступні за допомогою квадратних дужок. Цей спосіб корисний, якщо ім'я властивості зберігається у змінній або містить пробіли чи спеціальні символи:
let person = {
first name: 'John',
age: 30,
greet: function() {
return 'Привіт!';
}
};
console.log(person['first name']); // Виведе: John
console.log(person['age']); // Виведе: 30
let propertyName = 'greet';
console.log(person[propertyName]()); // Виведе: Привіт!
3. Зміна та додавання властивостей
Властивості об'єкта можуть бути змінені або додані будь-коли:
let person = {
name: 'John',
age: 30
};
// Зміна існуючої властивості
person.age = 31;
console.log(person.age); // Виведе: 31
// Додавання нової властивості
person.isStudent = false;
console.log(person.isStudent); // Виведе: false
4. Видалення властивостей
Властивості об'єкта можуть бути видалені за допомогою оператора delete:
let person = {
name: 'John',
age: 30,
isStudent: false
};
delete person.isStudent;
console.log(person.isStudent); // Виведе: undefined
6.3 Ітерація за властивостями об'єкта
1. Цикл for...in
Цикл for...in дозволяє перебирати всі перераховувані властивості об'єкта:
let person = {
name: 'John',
age: 30,
isStudent: false
};
for (let key in person) {
console.log(`${key}: ${person[key]}`);
}
// Виведе:
// name: John
// age: 30
// isStudent: false
2. Метод Object.keys()
Метод Object.keys() повертає масив усіх перераховуваних властивостей об'єкта:
let person = {
name: 'John',
age: 30,
isStudent: false
};
let keys = Object.keys(person);
console.log(keys); // Виведе: ['name', 'age', 'isStudent']
3. Метод Object.values()
Метод Object.values() повертає масив значень усіх перераховуваних властивостей об'єкта:
let person = {
name: 'John',
age: 30,
isStudent: false
};
let values = Object.values(person);
console.log(values); // Виведе: ['John', 30, false]
4. Метод Object.entries()
Метод Object.entries() повертає масив пар [ключ, значення] для всіх перераховуваних властивостей об'єкта:
let person = {
name: 'John',
age: 30,
isStudent: false
};
let entries = Object.entries(person);
console.log(entries); // Виведе: [['name', 'John'], ['age', 30], ['isStudent', false]]
6.4 Перевірка наявності властивостей
1. Оператор in
Оператор in дозволяє перевірити наявність властивості в об'єкті:
let person = {
name: 'John',
age: 30
};
console.log('name' in person); // Виведе: true
console.log('isStudent' in person); // Виведе: false
2. Метод hasOwnProperty()
Метод hasOwnProperty() перевіряє, чи є у об'єкта вказана властивість як його власна (не успадкована):
let person = {
name: 'John',
age: 30
};
console.log(person.hasOwnProperty('name')); // Виведе: true
console.log(person.hasOwnProperty('isStudent')); // Виведе: false
ПЕРЕЙДІТЬ В ПОВНУ ВЕРСІЮ