ID: 3358
Web
Średnie
Źródło: Arkusze CKE
Jakie elementy zostaną wyświetlone w przeglądarce po wykonaniu kodu źródłowego stworzonego za pomocą dwóch funkcjonalnie równoważnych fragmentów? KOD W ANGULAR:
tags: string[] = ['tag1', 'tag2', 'tag3' ];
// ...
<p ngFor="let tag of tags"> {{tag}} </p>
KOD W REACT.JS:
state = { tags: ['tag1', 'tag2', 'tag3'] };
// ... / w instrukcji return metody render */
<React.Fragment>
{ this.state.tags.map(tag => <p key={tag}>{tag}</p>) }
</React.Fragment>
Warianty odpowiedzi
-
A
Trzy paragrafy, w każdym z nich tekst o treści: {tag}.
-
B
Jeden paragraf zawierający wszystkie elementy tablicy tags w kolejności.
-
C
Trzy paragrafy, każdy odpowiadający kolejnemu elementowi tablicy tags.
-
D
Jeden paragraf z pierwszym elementem tablicy tags.
Wyjaśnienie
W obu fragmentach kodu mamy do czynienia z 3-elementową tablicą tags zawierającą teksty: tag1, tag2 oraz tag3.
W Angularze dyrektywa *ngFor przechodzi po każdym elemencie tej tablicy i renderuje dla niego osobny akapit p.
W React.js funkcja map działa analogicznie – transformuje każdy element tablicy w znacznik p zawierający dany tekst.
Efektem wykonania obu kodów będzie wyświetlenie trzech osobnych paragrafów na stronie.