Javascript – wstęp do programowania obiektowego

Teraz,gdy rozumiemy czym jest zmienna oraz znamy i umiemy stosować koncepcję funkcji, przyszła pora, by zaznajomić się z programowaniem obiektowym.

Na początek musimy jednak zdefiniować pojęcie obiektu. Otóż najprościej mówiąc obiekt jest złożonym typem danych. Jest to struktura posiadająca wbudowane w siebie zmienne oraz funkcję. Obiekt tworzymy w oparciu o klasę. Można powiedzieć że klasa to receptura na stworzenie obiektu. To w niej definiujemy jakie zmienne będzie miał obiekt, jakie metody będzie mógł wykonywać.

Javascript jest dosyć specyficzny pod kątem programowania obiektowego, głównie dla tego że wbrew temu co napisałem powyżej obiekt możemy stworzyć nie tylko w oparciu o klasę, ale również możemy go manualnie zdefiniować. Jednak zanim do tego przejdziemy, nauczmy się definiować klasy. Służy do tego słowo kluczowe class.

<script>
  class Czlowiek
  {
      imie = "Adam";
      nazwisko = "Kowalski";
      wiek = 33;
  }  
</script>

Aby na podstawie klasy stworzyć obiekt używamy słowa kluczowego new, następnie dodajemy nazwę klasy i całość kończymy nawiasem okrągłym. Dlaczego tak to zapisujemy wyjaśnię w innym wpisie.

<script>
  let adam = new Czlowiek()
  document.write(adam)
  document.write(typeof adam)  
</script>

Uzyskaliśmy wynik w postaci

Czlowiek { imie: 'Adam', nazwisko: 'Kowalski', wiek: 33 }
object

Na podstawie uzyskanego wyniku możemy sprawdzić, co się stanie, jeśli spróbujemy zdefiniować obiekt, zastępując zapis new Klasa() rezultatem polecenia console.log. Zapis wygląda tak:

<script>
  let adam = {imie: "Adam", nazwisko: "Kowalski", wiek: 35};

  document.write(adam);
  document.write(typeof adam);
</script>

Uzyskany rezultat trochę się różni. Typ obiektu jest taki sam, ale wyświetlona wartość minimalnie się różni. W pierwszym przykładzie mogliśmy znaleźć nazwę klasy w oparciu o którą stworzono obiekt, ale tutaj nazwa klasy nie występuje. Jest tak oczywiście dla tego, że obiekt nie powstał w oparciu o klasę.

{ imie: 'Adam', nazwisko: 'Kowalski', wiek: 33 }
object

Teraz załóżmy że tworzymy funkcję która otrzymuje obiekt klasy człowiek i ma za zadanie odczytać zmienne zawarte w obiekcie. Jak się do nich dostać. Służy do tego operator kropka [.]. Nasza funkcja będzie wyglądała tak:

<script>
  function raport(objekt)
  {
      document.write(objekt.imie)
      document.write(objekt.nazwisko)
      document.write(objekt.wiek)
  }
</script>

Uzyskany wynik dla obiektu adam

Adam
Kowalski
33

Na początku wpisu wspomniałem, że obiekt może zawierać w sobie funkcje. W programowaniu obiektowym nazywamy je metodami. Definiujemy je bez podania słowa function, wygląda to tak:

<script>
  class Czlowiek
  {
     napiszCos()
     {
      document.write("Witaj")
     }
  }

  const adam = new Czlowiek();
  adam.napiszCos();
</script>

Sebastian Nosal

Ostatnio zaktualizowane: 20 października 2022

Egzamin EE.09, Egzamin INF.03, JavaScript