Kihagyás

A gyakorlat anyaga

Ezen a gyakorlaton megismerkedünk a JavaScript fontosabb adatszerkezeteivel.

Tömbök

JavaScriptben a tömb (Array) tetszőleges mennyiségű, nem feltétlenül azonos típusú adat tárolására alkalmas adatszerkezet.

Tömb létrehozása

JavaScriptben alapvetően kétféle módszerrel hozhatunk létre tömböket:

  • a new Array() segítségével
  • a tömbelemek szögletes zárójelek közötti felsorolásával.

A későbbiekben szinte mindig a tömbelemek szögletes zárójelek közötti felsorolását fogjuk használni tömbök létrehozásakor.

Példa: Tömb létrehozása

1
2
3
4
5
let tomb1 = new Array(10);      // egy 10 elem tárolósára képes tömb létrehozása (üres értékek)
let tomb2 = new Array(10, 20);  // egy, a 10 és 20 elemeket tároló tömb létrehozása

let tomb3 = [];                 // üres tömb létrehozása
let tomb4 = [10, 20, 30, 40];   // szám adatokat tároló tömb létrehozása

Tömbök hossza

Egy tömb hosszának lekérdezésére a length property-t használjuk JavaScriptben.

1
2
let gyumolcsok = ["alma", "körte", "szilva", "barack"];
console.log(gyumolcsok.length);

Kimenet

4

Tömbelemek indexelése

A tömbök elemeit a szokásos tömbindex operátorokkal tudjuk elérni: tombNeve[index].

Az indexelés itt is 0-tól kezdődik. A Pythonban tanult negatív, illetve intervallumos indexelés JavaScriptben nem működik!

Ha JavaScriptben egy nem létező indexű tömbelemre hivatkozunk (pl. alul- vagy túlindexeljük a tömböt), akkor undefined értéket kapunk.

1
2
3
4
5
let macskak = ["Garfield", "Nermal", "Grumpy Cat", "Tom"];

console.log(macskak[0]);                        // a legelső elem
console.log(macskak[macskak.length - 1]);       // az utolsó elem
console.log(macskak[-1]);                       // ez JavaScriptben nem működik!

Kimenet

Garfield Tom undefined

A stringekkel ellentétben a tömb egy mutable (módosítható) típus, így lehetőségünk van arra, hogy egy adott indexű elem értékét módosítsuk.

1
2
3
let macskak = ["Garfield", "Nermal", "Grumpy Cat", "Tom"];
macskak[1] = "Szilveszter";
console.log(macskak);

Kimenet

[ 'Garfield', 'Szilveszter', 'Grumpy Cat', 'Tom' ]

Tömbök bejárása

Ha végig szeretnénk iterálni egy tömb elemein, akkor azt egy for-ciklussal tudjuk egyszerűen megtenni. Kétféle szintaxist használhatunk:

  • a hagyományos, index alapján történő bejárást
  • listaszerű bejárást (for-of szintaxis).

Példa: Tömb elemeinek bejárása

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
let macskak = ["Garfield", "Nermal", "Grumpy Cat", "Tom"];

// hagyományos, index alapú bejárás

for (let i = 0; i < macskak.length; i++) {
    console.log(macskak[i]);
}

console.log("----------------------------");

// listaszerű bejárás - a macska változó rendre felveszi a tömbelemek értékét

for (let macska of macskak) {
    console.log(macska);
}

Tömbkezelő függvények

A JavaScript számos beépített függvényt biztosít tömbök kezelésére. Ezek közül néhány hasznosabb:

  • t.pop() törli (és visszaadja) az utolsó elemet a t tömbből
  • t.push(a, b, ...): beszúrja az a, b, ... elemeket a t tömb végére
  • t.shift(): törli (és visszaadja) a legelső elemet a t tömbből
  • t.unshift(a, b, ...): beszúrja az a, b, ... elemeket a t tömb elejére
  • t.sort(): rendezi a t tömb elemeit
  • t.indexOf(e): visszaadja az e elem legelső előfordulásának a kezdőindexét a t tömbön belül (-1-et ad vissza, ha nem szerepel benne)
  • t.slice(startIndex, endIndex): visszaadja a tömb startIndex és endIndex közötti elemeit
    • mindig egy új tömböt ad vissza (nem módosítja az eredeti tömböt)
    • az endIndex indexű elem már nem lesz benne a visszaadott tömbben
    • az endIndex paraméter elhagyható: ha nem adjuk meg, akkor startIndex-től kezdve a tömb összes "hátralévő" elemét kapjuk vissza
  • t.join(separator): egy stringgé egyesíti a tömböt, amiben a tömbelemek separator karakterrel lesznek elválasztva
  • ...

Példa: Tömbkezelő függvények használata

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
let bevasarlolista = ["tej", "tojás", "sajt", "üdítő"];

bevasarlolista.pop();                           // törlés a végéről
bevasarlolista.push("kenyér", "felvágott");     // beszúrás a végére
bevasarlolista.shift();                         // törlés az elejéről
bevasarlolista.unshift("kalkulus példatár");    // beszúrás az elejére

bevasarlolista.sort();                          // rendezés
let szovegkent = bevasarlolista.join("; ");     // egyesítés szöveggé
console.log("Ezeket kell megvennünk: " + szovegkent);

let fontos = bevasarlolista.slice(1, 3);        // "résztömb" lekérése
console.log("Minél hamarabb vegyük meg:");
console.log(fontos);

Kimenet

Ezeket kell megvennünk: felvágott; kalkulus példatár; kenyér; sajt; tojás Minél hamarabb vegyük meg: [ 'kalkulus példatár', 'kenyér' ]

Utolsó frissítés: 2023-11-03 13:38:17