6.1 Tworzenie obiektów
Obiekty są jednym z podstawowych typów danych w JavaScript i są szeroko używane do przechowywania i zarządzania danymi. Obiekt to kolekcja właściwości, gdzie każda właściwość składa się z klucza (nazwy) i wartości. W tym wykładzie omówimy tworzenie obiektów, a także dostęp do ich właściwości i metod.
1. Literał obiektu
Najczęstszym sposobem tworzenia obiektu w JavaScript jest użycie literału obiektu.
W tym przykładzie stworzyliśmy obiekt person z czterema właściwościami: name, age, isStudent i greet.
let person = {
name: 'John',
age: 30,
isStudent: false,
greet: function() {
return 'Hello!';
}
};
2. Konstruktor Object
Obiekty mogą być również tworzone za pomocą konstruktora Object().
Ten sposób jest równoważny z tworzeniem obiektu za pomocą literału obiektu, ale jest bardziej rozwlekły:
let person = new Object();
person.name = 'John';
person.age = 30;
person.isStudent = false;
person.greet = function() {
return 'Hello!';
};
3. Funkcja-konstruktor
Funkcja-konstruktor pozwala tworzyć wiele egzemplarzy obiektów z identycznymi właściwościami i metodami.
W tym przykładzie funkcja-konstruktor Person() jest używana do tworzenia obiektów john
i jane z identycznymi właściwościami i metodami:
function Person(name, age, isStudent) {
this.name = name;
this.age = age;
this.isStudent = isStudent;
this.greet = function() {
return 'Hello!';
};
}
let john = new Person('John', 30, false);
let jane = new Person('Jane', 25, true);
4. Metoda Object.create()
Metoda Object.create() tworzy nowy obiekt z podanym prototypem i właściwościami.
W tym przykładzie obiekt john jest tworzony na podstawie prototypu personPrototype:
let personPrototype = {
greet: function() {
return 'Hello!';
}
};
let john = Object.create(personPrototype);
john.name = 'John';
john.age = 30;
john.isStudent = false;
6.2 Dostęp do właściwości i metod
1. Dostęp za pomocą kropki
Najczęstszym sposobem dostępu do właściwości i metod obiektu jest poprzez kropkę:
let person = {
name: 'John',
age: 30,
greet: function() {
return 'Hello!';
}
};
console.log(person.name); // Wyświetli: John
console.log(person.age); // Wyświetli: 30
console.log(person.greet()); // Wyświetli: Hello!
2. Dostęp za pomocą nawiasów klamrowych
Właściwości obiektu mogą być również dostępne za pomocą nawiasów klamrowych. Ten sposób jest przydatny, gdy nazwa właściwości jest przechowywana w zmiennej lub zawiera spacje lub specjalne znaki:
let person = {
'first name': 'John',
age: 30,
greet: function() {
return 'Hello!';
}
};
console.log(person['first name']); // Wyświetli: John
console.log(person['age']); // Wyświetli: 30
let propertyName = 'greet';
console.log(person[propertyName]()); // Wyświetli: Hello!
3. Zmiana i dodawanie właściwości
Właściwości obiektu mogą być zmieniane lub dodawane w dowolnym momencie:
let person = {
name: 'John',
age: 30
};
// Zmiana istniejącej właściwości
person.age = 31;
console.log(person.age); // Wyświetli: 31
// Dodawanie nowej właściwości
person.isStudent = false;
console.log(person.isStudent); // Wyświetli: false
4. Usuwanie właściwości
Właściwości obiektu mogą być usuwane za pomocą operatora delete:
let person = {
name: 'John',
age: 30,
isStudent: false
};
delete person.isStudent;
console.log(person.isStudent); // Wyświetli: undefined
6.3 Iteracja po właściwościach obiektu
1. Pętla for...in
Pętla for...in pozwala na przeglądanie wszystkich enumeratywnych właściwości obiektu:
let person = {
name: 'John',
age: 30,
isStudent: false
};
for (let key in person) {
console.log(`${key}: ${person[key]}`);
}
// Wyświetli:
// name: John
// age: 30
// isStudent: false
2. Metoda Object.keys()
Metoda Object.keys() zwraca tablicę wszystkich enumeratywnych właściwości obiektu:
let person = {
name: 'John',
age: 30,
isStudent: false
};
let keys = Object.keys(person);
console.log(keys); // Wyświetli: ['name', 'age', 'isStudent']
3. Metoda Object.values()
Metoda Object.values() zwraca tablicę wartości wszystkich enumeratywnych właściwości obiektu:
let person = {
name: 'John',
age: 30,
isStudent: false
};
let values = Object.values(person);
console.log(values); // Wyświetli: ['John', 30, false]
4. Metoda Object.entries()
Metoda Object.entries() zwraca tablicę par [klucz, wartość] dla wszystkich enumeratywnych właściwości obiektu:
let person = {
name: 'John',
age: 30,
isStudent: false
};
let entries = Object.entries(person);
console.log(entries); // Wyświetli: [['name', 'John'], ['age', 30], ['isStudent', false]]
6.4 Sprawdzanie obecności właściwości
1. Operator in
Operator in pozwala sprawdzić obecność właściwości w obiekcie:
let person = {
name: 'John',
age: 30
};
console.log('name' in person); // Wyświetli: true
console.log('isStudent' in person); // Wyświetli: false
2. Metoda hasOwnProperty()
Metoda hasOwnProperty() sprawdza, czy obiekt posiada określoną właściwość jako swoją własną (nie dziedziczoną):
let person = {
name: 'John',
age: 30
};
console.log(person.hasOwnProperty('name')); // Wyświetli: true
console.log(person.hasOwnProperty('isStudent')); // Wyświetli: false
GO TO FULL VERSION