Kategoria: JavaScript

Wyszukiwanie po tablicach w JavaScript


Tablice są istotnym elementem w języku programowania JavaScript, umożliwiając przechowywanie i manipulację danymi. W tym artykule przedstawię kilka sposobów na szukanie elementów lub ich indeksów w tablicy.

Wyszukiwanie elementów w tablicy

Funkcja find

Funkcja find zwraca pierwszy element, który spełnia warunek. Jeśli nie znajdzie żadnego zwraca undefined. Jest szczególnie przydatna, gdy mamy do czynienia z tablicą obiektów i chcemy znależć obiekt o określonych właściwościach.

const fruits = [
  { name: 'apple', color: 'red' },
  { name: 'banana', color: 'yellow' },
  { name: 'orange', color: 'orange' },
]
const orange = fruits.find((fruit) => fruit.name === 'orange') // Zwraca { name: 'orange', color: 'orange' }

Funkcja filter

Jeśli chcemy znaleźć wszystkie elementy, które spełniają warunek, możemy użyć funkcji filter.

const fruits = [
  { name: 'apple', color: 'red' },
  { name: 'banana', color: 'yellow' },
  { name: 'strawberry', color: 'red' },
]
const redFruits = fruits.filter((fruit) => fruit.color === 'red') // Zwraca [{ name: 'apple', color: 'red' }, { name: 'strawberry', color: 'red' }]

Wyszukiwanie indeksów elementów w tablicy

Funkcja findIndex

Jeśli chcemy znaleźć indeks pierwszego elementu, który spełnia warunek, możemy użyć funkcji findIndex.

const fruits = [
  { name: 'apple', color: 'red' },
  { name: 'banana', color: 'yellow' },
  { name: 'orange', color: 'orange' },
]
const orangeIndex = fruits.findIndex((fruit) => fruit.name === 'orange') // Zwraca 2

Funkcja map

Funkcja map zasadniczo nie służy do wyszukiwania elementów. Jednak, jeśli chcemy znaleźć indeksy wszystkich elementów, które spełniają warunek, możemy jej użyć w połączeniu z funkcją filter.

const fruits = [
  { name: 'apple', color: 'red' },
  { name: 'banana', color: 'yellow' },
  { name: 'strawberry', color: 'red' },
]
const redFruits = fruits
  .map((fruit, index) => (fruit.color === 'red' ? index : null))
  .filter((index) => index !== null) // Zwraca [0, 2]

Funkcja indexOf

Funkcja indexOf zwraca indeks pierwszego elementu, który spełnia warunek. Jeśli nie znajdzie żadnego zwraca -1. Możemy jej użyć, jeśli szukamy pośród elementów o typie prostym, np. string lub number.

const fruits = ['apple', 'banana', 'orange']
const orangeIndex = fruits.indexOf('orange') // Zwraca 2

Sprawdzenie czy element istnieje w tablicy

Funkcja includes

Funkcja includes zwraca wartość logiczną true jeśli element istnieje w tablicy, lub false jeśli nie istnieje.

const fruits = ['apple', 'banana', 'orange']
const hasOrange = fruits.includes('orange') // Zwraca true

Funkcja some

Funkcja some zwraca wartość logiczną true jeśli przynajmniej jeden element spełnia warunek, lub false jeśli żaden nie spełnia. Jest szczególnie przydatna, jeśli szukamy po tablicy obiektów.

const fruits = [
  { name: 'apple', color: 'red' },
  { name: 'banana', color: 'yellow' },
  { name: 'orange', color: 'orange' },
]
const hasOrange = fruits.some((fruit) => fruit.name === 'orange') // Zwraca true