Podstawowe metody tablic

7.1 Metoda splice()

Tablice w JavaScript oferują wbudowane metody do manipulacji danymi. W tym wykładzie omówimy cztery podstawowe metody tablic: splice(), slice(), concat() i indexOf(). Każda z tych metod wykonuje określone operacje na tablicach i może znacznie uprościć przetwarzanie danych.

Metoda splice() zmienia zawartość tablicy, usuwając istniejące elementy i/lub dodając nowe elementy na ich miejsce.

Składnia:

    
      
       
   
       
   
       
   
     splice 
   (start, deleteCount, item1, item2, ...);
    
  

Gdzie:

• start: indeks, od którego należy rozpocząć zmiany
• deleteCount: liczba usuwanych elementów. Jeśli nie jest podane, usuwane są wszystkie elementy, zaczynając od pozycji start
• item1, item2, ...: elementy dodawane do tablicy. Jeśli nie jest podane, elementy nie są dodawane

Przykład 1: Usuwanie elementów

W tym przykładzie z tablicy fruits usuwane są dwa elementy, zaczynając od indeksu 2. Zwracana wartość to tablica usuniętych elementów.

    
      let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
      let removed = fruits.splice(2, 2);

      console.log(fruits);   // Wyświetli: ['apple', 'banana', 'fig']
      console.log(removed);  // Wyświetli: ['cherry', 'date']
    
  

Przykład 2: Dodawanie elementów

W tym przykładzie do tablicy fruits dodawane są dwa nowe elementy (date i fig) zaczynając od indeksu 2. Elementy nie są usuwane.

    
      let fruits = ['apple', 'banana', 'cherry'];
      fruits.splice(2, 0, 'date', 'fig');

      console.log(fruits);   // Wyświetli: ['apple', 'banana', 'date', 'fig', 'cherry']
    
  

Przykład 3: Zamiana elementów

W tym przykładzie element z indeksem 1 (banana) zostaje zastąpiony dwoma nowymi elementami (date i fig).

    
      let fruits = ['apple', 'banana', 'cherry'];
      fruits.splice(1, 1, 'date', 'fig');

      console.log(fruits);   // Wyświetli: ['apple', 'date', 'fig', 'cherry']
    
  

7.2 Metoda slice()

Metoda slice() zwraca nową tablicę, zawierającą kopię części oryginalnej tablicy. Oryginalna tablica nie jest zmieniana.

Składnia:

    
      array.slice(begin, end);
    
  

Gdzie:

• begin: indeks, od którego należy rozpocząć kopiowanie
• end: indeks, do którego kopiować (nie włączając elementu z tym indeksem). Jeśli nie jest podane, kopiowane są wszystkie elementy do końca tablicy

Przykład 1: Kopiowanie części tablicy

W tym przykładzie tworzona jest nowa tablica, zawierającą elementy z indeksami od 1 do 2 z tablicy fruits.

    
      let fruits = ['apple', 'banana', 'cherry', 'date', 'fig'];
      let sliced = fruits.slice(1, 3);

      console.log(sliced);   // Wyświetli: ['banana', 'cherry']
    
  

Przykład 2: Kopiowanie od początku tablicy

W tym przykładzie tworzona jest nowa tablica, zawierającą elementy z indeksami 0 i 1 z tablicy fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let sliced = fruits.slice(0, 2);

      console.log(sliced);   // Wyświetli: ['apple', 'banana']
    
  

Przykład 3: Kopiowanie do końca tablicy

W tym przykładzie tworzona jest nowa tablica, zawierająca elementy od indeksu 1 do końca tablicy fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let sliced = fruits.slice(1);

      console.log(sliced);   // Wyświetli: ['banana', 'cherry']
    
  

7.3 Metoda concat()

Metoda concat() używana jest do łączenia dwóch lub więcej tablic. Zwraca nową tablicę, zawierającą elementy wszystkich połączonych tablic.

Składnia:

    
      array1.concat(array2, array3, ...);
    
  

Gdzie:

• array1, array2, array3, ...: tablice, które należy połączyć

Przykład 1: Łączenie dwóch tablic

W tym przykładzie tablice fruits1 i fruits2 są łączone w nową tablicę combined.

    
      let fruits1 = ['apple', 'banana'];
      let fruits2 = ['cherry', 'date'];
      let combined = fruits1.concat(fruits2);

      console.log(combined); // Wyświetli: ['apple', 'banana', 'cherry', 'date']
    
  

Przykład 2: Łączenie kilku tablic

W tym przykładzie trzy tablice są łączone w nową tablicę combined.

    
      let fruits1 = ['apple', 'banana'];
      let fruits2 = ['cherry', 'date'];
      let fruits3 = ['fig', 'grape'];
      let combined = fruits1.concat(fruits2, fruits3);

      console.log(combined); // Wyświetli: ['apple', 'banana', 'cherry', 'date', 'fig', 'grape']
    
  

Przykład 3: Łączenie tablicy z elementami

W tym przykładzie do tablicy fruits dodawane są elementy cherry i date, tworząc nową tablicę moreFruits.

    
      let fruits = ['apple', 'banana'];
      let moreFruits = fruits.concat('cherry', 'date');

      console.log(moreFruits); // Wyświetli: ['apple', 'banana', 'cherry', 'date']
    
  

7.4 Metoda indexOf()

Metoda indexOf() zwraca pierwszy indeks, pod którym dany element może być znaleziony w tablicy, lub -1, jeśli element nie został znaleziony.

Składnia:

    
      array.indexOf(searchElement, fromIndex);
    
  

Gdzie:

• searchElement: element, który należy znaleźć
• fromIndex: indeks, od którego należy rozpocząć poszukiwanie. Jeśli nie jest podane, poszukiwanie zaczyna się od początku tablicy

Przykład 1: Wyszukiwanie elementu w tablicy

W tym przykładzie metoda indexOf() zwraca indeks elementu banana w tablicy fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let index = fruits.indexOf('banana');

      console.log(index); // Wyświetli: 1
    
  

Przykład 2: Element nie został znaleziony

W tym przykładzie metoda indexOf() zwraca -1, ponieważ element date nie został znaleziony w tablicy fruits.

    
      let fruits = ['apple', 'banana', 'cherry'];
      let index = fruits.indexOf('date');

      console.log(index); // Wyświetli: -1
    
  

Przykład 3: Wyszukiwanie elementu od określonego indeksu

W tym przykładzie metoda indexOf() rozpoczyna wyszukiwanie elementu banana od indeksu 2 i znajduje go na indeksie 3.

    
      let fruits = ['apple', 'banana', 'cherry', 'banana'];
      let index = fruits.indexOf('banana', 2);

      console.log(index); // Wyświetli: 3