Co zostanie wygenerowane w przeglądarce w wyniku działania kodu źródłowego zapisanego za pomocą dwóch równoważnych funkcjonalnie fragmentów?

Poprawna odpowiedź: A

Uzasadnienie i szersze wyjaśnienie:

Oba przedstawione fragmenty kodu, jeden dla frameworka Angular, a drugi dla biblioteki React.js, realizują tę samą operację: iterują po tablicy tags i dla każdego jej elementu generują nowy element HTML.

• W kodzie Angular: Dyrektywa strukturalna *ngFor="let tag of tags" tworzy pętlę. Dla każdego elementu z tablicy tags, Angular tworzy nowy znacznik <p>, a w jego wnętrzu, dzięki interpolacji {{tag}}, umieszcza wartość danego elementu.
• W kodzie React.js: Standardowa metoda tablicowa JavaScript .map(tag => ...) jest używana do przekształcenia każdego elementu tablicy tags w element JSX. Dla każdego tag w tablicy, funkcja zwraca nowy paragraf <p>{tag}</p>, którego treścią jest wartość tag.

Tablica tags zawiera trzy elementy: 'tag1', 'tag2', 'tag3'. W obu przypadkach pętla wykona się trzy razy, tworząc trzy osobne paragrafy (<p>), z których każdy będzie zawierał kolejny element z tablicy.

Dlaczego pozostałe odpowiedzi są nieprawidłowe?

• B i C: Oba mechanizmy tworzą nowy element dla każdej iteracji, a nie jeden zbiorczy.
• D: Składnia {{tag}} (Angular) i {tag} (React) służy do wyświetlania wartości zmiennej tag, a nie dosłownego tekstu.