Typy złożone na przykładzie: tablic i obiektów

W JavaScript istnieją dwie podstawowe struktury danych. Mowa tutaj o tablicach i Obiektach. W porównaniu do typów prostych reprezentują zbiór wartości. Zapewne opanowałeś już podstawowe typy danych w JavaScript, nadszedł więc czas na przybliżenie typów złożonych jakim są obiekty i tablice.

Obiekty

W JavaScript obiekt jest bytem podobnym do tablicy, różnica polega na własnym tworzeniu kluczy. Przez co nie jesteśmy ograniczeni w nazewnictwie wyłącznie do kluczy numerycznych.
Wyobraźmy sobie samochody. Każda z nich jest jakoś nazywany. Przykładowo : Opel – Astra. Mamy tutaj markę wraz z  towarzyszącym mu modelem. Podobnie reprezentuje się struktura obiektu. W obiekcie znajdują się pary – "własność": wartość . Należy pamiętać że każda własność musi posiadać unikalną nazwę. Natomiast wartość jest dowolna (liczby, wartości logiczne, ciągi znaków, tablice, obiekty lub funkcje).

Literały obiektowe nie posiadające zagnieżdżenia mają bardzo prostą konstrukcję. Możemy je stworzyć za pomocą

1. Obiektu Literału

 let obj = {} // konstruuje pusty obiekt
 let  person = {
     name: "Jan Kowalski",
     email: "jankowalski@email.com",
 }
 let  objXY = {x: 0, y: 0} 

2. Konstruktora

 class Person  {
     constructor(name, surname) {
     this.name = name;
     this.surname =   surname ;
    }
 }
 const daneOsobowe = new Person(Jan,Kowalski);
 console.log(daneOsobowe.name); // output  Jan;
 console.log(daneOsobowe.surname); // output Kowalski

2. Metoda Object.create()

const car = {
   isHibryd: false,
   printIntroduction: function() {
     console.log(`Marka ${this.model}. To Hybryda? ${this.isHibryd}`);
  }
 };
 let myCar= Object.create(car);
 myCar.model= 'Matthew'; // "model" jest własnością instancji obiektu person o nazwie me
 myCar.isHibryd= true; // właściwości dziedziczone mogą być nadpisywane
 myCar.printIntroduction(); 
//  wywołanie funkcji która znajduje się wewnątrz obiektu  
// "Model Corsa. To Hybryda? true"

Można potocznie uznać, iż obiekty są w w istocie tablicami asocjacyjnymi. Obiekt prezentuje się podobnie jak tablica, dlatego że jest zbiorem nazwanych wartości . Właśnie dlatego możemy się odnieść do określonego elementu poprzez nawias kwadratowy.

Tablice

Tablica jest także zbiorem wartości. Służą do przechowywania wielu elementów które są w dodatku  uporządkowanym zbiorem, przeciwnie do wcześniej wspomnianego obiektu który jest zbiorem  nazwanych wartości.

Do czego służy tablica ? Mianowicie wyobraźmy sobie że mamy kilka marek samochodów które jak wiadomo posiadają różne modele. Najlepszym sposobem na uporządkowanie tego typu danych będzie służyć tablica.

 const opel = ["astra", "vectra", "insignia", "corsa" ];
 const toyota = ["avensis", "camry", "celica"];
 const ford = ["fiesta", "focus", "mondeo"];
 const samochody = [[opel], [toyota],[ford], ]; 

Każdy element posiada  pozycje czyli  numerem w tablicy – pozycja nazywana jest indeksem. Dzięki  nim tablice doskonale nadają się do iteracji  przy użyciu pętli for.

 const opel = ["astra", "vectra", "insignia", "corsa" ];
// Sprawdźmy indexy poszczególnych elementów w tablicy
 console.log(opel.indexOf("astra", "vectra", "insignia", "corsa"));
// Wykonajmy pętle aby sprawdzić każdy element tablicy
for (let i = 0; i < opel.length; i++) {
  console.log(opel[i]);
}

<- Wynik z metody indexOf ->
0
1
2
3
<- Wynik z pętli for ->
astra
vectra
insignia
corsa

Nie możemy uzyskać dostępu do elementów tablicy przy użyciu notacji z kropką –  jak podczas uzyskiwania dostępu do elementów obiektu. Dostęp do poszczególnych elementów uzyskujemy przez podanie w tablicy numeru indeksu.

console.log (opel [0]); //  - wypisuje wartość pierwszego elementu 

Tablice tak jak obiekty możemy tworzyć na różne sposoby.

1. Obiekt Literału

 const owoce = ['kiwi', 'mango'];

2. Konstruktora

 const owoce = new Array("kiwi","mango");

3. Metoda Array.of

 const owoce = Array.of("kiwi","mango");

4. Metoda Array.from

 const owoce = Array.from("kiwi","mango");

Podsumowanie

W tym artykule omówiliśmy, krótko czym są i jak tworzyć złożone typy danych jakimi są obiekty i tablice. W późniejszym czasie omówimy poszczególne metody z użyciem tych dwóch typów danych.