Node.js dla początkujących - Część 5: Objekty

Witaj w kolejnej lekcji kursu JavaScript dla początkujących! Dziś zanurzymy się w fascynujący świat obiektów. Obiekty są fundamentem programowania obiektowego i pozwalają nam grupować powiązane ze sobą dane i funkcje w logiczne całości. Wyobraź sobie, że masz pudełko, w którym możesz przechowywać różne rzeczy – to właśnie jest obiekt w JavaScript. Gotowy na dawkę wiedzy? Zaczynamy!

Czym są obiekty?

Obiekt w JavaScript to zbiór par klucz-wartość. Klucz (nazywany też właściwością) to nazwa, a wartość to dane, które przechowujemy pod tą nazwą. Wartościami mogą być liczby, teksty, tablice, a nawet inne obiekty!

Tworzenie obiektów

Istnieje kilka sposobów tworzenia obiektów w JavaScript. Najprostszy z nich to użycie literału obiektowego:

const osoba = {
  imie: "Jan",
  nazwisko: "Kowalski",
  wiek: 30,
  zawod: "Programista"
};

W powyższym przykładzie stworzyliśmy obiekt o nazwie osoba. Ma on cztery właściwości: imie, nazwisko, wiek i zawod. Każda z nich ma przypisaną konkretną wartość.

Inny sposób to użycie słowa kluczowego new i konstruktora Object():

const samochod = new Object();
samochod.marka = "Toyota";
samochod.model = "Corolla";

Ten sposób jest rzadziej używany, ale warto o nim wiedzieć.

Właściwości i metody

Wspomniałem już o właściwościach. A co z metodami? Metoda to po prostu funkcja, która jest częścią obiektu. Definiujemy ją tak samo jak funkcję, ale wewnątrz obiektu:

const kalkulator = {
  dodaj: function(a, b) {
    return a + b;
  },
  odejmij: function(a, b) {
    return a - b;
  }
};

const suma = kalkulator.dodaj(5, 3); // suma będzie równa 8

Od JavaScript ES6 możemy stosować skrócony zapis definiowania metod:

const kalkulator = {
  dodaj(a, b) {
    return a + b;
  },
  odejmij(a, b) {
    return a - b;
  }
};

Notacja kropkowa i nawiasowa

Do właściwości i metod obiektu możemy się odwoływać na dwa sposoby: za pomocą notacji kropkowej lub notacji nawiasowej.

• Notacja kropkowa:

console.log(osoba.imie); // Wypisze: Jan
console.log(samochod.marka); // Wypisze: Toyota

• Notacja nawiasowa:

console.log(osoba["nazwisko"]); // Wypisze: Kowalski
console.log(samochod["model"]); // Wypisze: Corolla

Notacja nawiasowa jest szczególnie przydatna, gdy nazwa właściwości jest przechowywana w zmiennej:

const nazwaWlasciwosci = "wiek";
console.log(osoba[nazwaWlasciwosci]); // Wypisze: 30

Słowo kluczowe this

Słowo kluczowe this odnosi się do aktualnego obiektu, w kontekście którego jest wywoływana metoda. Zobaczmy to na przykładzie:

const czlowiek = {
  imie: "Adam",
  przywitaj() {
    console.log("Cześć, jestem " + this.imie + "!");
  }
};

czlowiek.przywitaj(); // Wypisze: Cześć, jestem Adam!

W tym przypadku this wewnątrz metody przywitaj() odnosi się do obiektu czlowiek.

Przykłady

Stwórzmy teraz bardziej złożony przykład: obiekt reprezentujący książkę:

const ksiazka = {
  tytul: "Wiedźmin: Ostatnie życzenie",
  autor: "Andrzej Sapkowski",
  strony: 320,
  czytaj() {
      console.log(`Czytam książkę pt. "${this.tytul}" autorstwa ${this.autor}. Przeczytałem już ${this.przeczytaneStrony} stron.`)
  },
  przeczytaneStrony: 100
};

ksiazka.czytaj(); // Wypisze: Czytam książkę pt. "Wiedźmin: Ostatnie życzenie" autorstwa Andrzej Sapkowski. Przeczytałem już 100 stron.

Praca domowa

1. Stwórz obiekt reprezentujący Twój ulubiony film. Powinien zawierać takie właściwości jak tytuł, reżyser, rok produkcji i gatunek. Dodaj metodę, która wyświetli informacje o filmie w konsoli.
2. Stwórz obiekt reprezentujący prosty koszyk zakupowy. Dodaj metody do dodawania i usuwania produktów z koszyka.

Podsumowanie

Obiekty są niezwykle ważnym elementem JavaScript. Pozwalają na organizację kodu i tworzenie bardziej złożonych aplikacji. Zachęcam Cię do eksperymentowania z kodem i modyfikowania podanych przykładów. Pamiętaj, że praktyka czyni mistrza!

Zapraszam również do przeczytania pozostałych artykułów z naszego kursu JavaScript dla początkujących. Znajdziesz tam wiele cennych informacji, które pomogą Ci stawiać pierwsze kroki w świecie programowania. Do zobaczenia w kolejnej lekcji!