Przejdź do treści głównej
INF.04Pytanie #618 z 856frameworki-frontendowe-spa

W wyniku wykorzystania funkcjonalnie równoważnych sobie kodów Angular i React.js na poniższych danych, zostanie uzyskany wynik:

javascript
// Dane:
cars = [
  {id: 1, name: "Mercedes", year: 2021},
  {id: 2, name: "Opel", year: 2014},
  {id: 3, name: "Toyota", year: 2019}
]

// Angular:
<div *ngFor = "let car of cars; let i=index">
  <p>{{ i }}: {{ car.id }} {{ car.name }}</p>
</div>

// React.js:
{ this.cars.map((car, index) => <p>{ index }: { car.id } { car.name }</p>) }
Opcje odpowiedzi:
A
0: 1 Mercedes 1: 2 Opel 2: 3 Toyota
Prawidłowa
B
1 Mercedes 2021
C
Mercedes 2021 Opel 2014 Toyota 2019
D
1 Mercedes 2021 2 Opel 2014 3 Toyota 2019
Reklama

Wyjaśnienie i uzasadnienie dydaktyczne

Poprawna odpowiedź to A. Zarówno w pętli *ngFor (Angular), jak i w metodzie map() (React), wykorzystywany jest indeks elementu tablicy (zmienna i lub index), który jest liczony od 0. Kod wyświetla format: Indeks: ID Nazwa. Rok produkcji (year) nie jest używany w szablonie.

  • Dla pierwszego elementu: Indeks 0, ID 1, Name Mercedes -> 0: 1 Mercedes
  • Dla drugiego: Indeks 1, ID 2, Name Opel -> 1: 2 Opel
  • Dla trzeciego: Indeks 2, ID 3, Name Toyota -> 2: 3 Toyota

Chcesz poćwiczyć całą kwalifikację INF.04?

Egzamin próbny na czas, nauka działami, losowe pytanie albo przegląd całej bazy — wszystko w przeglądarce i bez zakładania konta.

Rozwiąż w Quizie

Pojęcia z tego pytania

Cały słownik INF04
Reklama

Podobne pytania z działu „Frameworki frontendowe spa”

Ten sam obszar materiału z kwalifikacji INF.04. W całej bazie znajdziesz 35 pytań z tego działu.