Ćwiczenie · Informatyka Ćwiczenie: Obsługa braku wyniku wyszukiwania w find

Obsługa braku wyniku wyszukiwania w find

Treść zadania

W sklepie mamy tablicę produktów:
const katalog = [
  { id: 1, nazwa: "Laptop" },
  { id: 2, nazwa: "Tablet" }
];

W dokumencie znajduje się pole <input type="number" id="kodProduktu" value="99">, przycisk <button id="btnSprawdzKatalog">Sprawdź</button> oraz akapit <p id="statusTowaru"></p>.
Napisz skrypt, który po kliknięciu szuka produktu po id. Jeśli produkt zostanie znaleziony, wpisuje 'Produkt: ' + p.nazwa; jeśli nie (zwrócono undefined), wpisuje 'Nie znaleziono produktu'.

Co będzie oceniane

  • Wywołanie metody find na tablicy katalog.
  • Sprawdzenie warunku if (wynik) / else.
  • Wpisanie 'Nie znaleziono produktu' dla nieistniejącego ID.
  • Kod uruchamia się bez błędu i przechodzi wszystkie testy automatyczne.

Testy automatyczne (2)

  1. Brak towaru dla kodu 99 — tekst #statusTowaru = Nie znaleziono produktu
  2. Odnalezienie towaru dla kodu 1 — tekst #statusTowaru = Produkt: Laptop

Zaliczenie: wszystkie testy muszą przejść. Testy uruchamia się przyciskiem „Sprawdź testy” pod kodem.

const katalog = [
  { id: 1, nazwa: "Laptop" },
  { id: 2, nazwa: "Tablet" }
];

// Obsłuż wynik find() i wpisz status do #statusTowaru po kliknięciu #btnSprawdzKatalog

Wskazówki

Wskazówka 1

Gdy żaden element tablicy nie spełnia kryterium, metoda find zwraca undefined. Zawsze sprawdź wynik za pomocą instrukcji warunkowej if.

Wskazówka 2

Zapisz wynik wywołania find do zmiennej, sprawdź czy zmienna nie jest pusta, i w zależności od rezultatu wpisz odpowiedni komunikat do docelowego akapitu.