wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

ZTInt

Total questions: 24

Worksheet time: 14mins

Name
Class
Date
1.

W przypadku protokołu HTTP, wśród nagłówków "response headers" należy zwrócić uwagę na content-type, który określa typ MIME danych. Jest to rodzaj danego pliku czy dokumentu, np. dokument HTML ma typ text/html, filmy mp4 mają typ video/mp4, a pliki dźwiękowe WAV mają audio/wav. Wybierz poprawne zdanie podsumowujące:

a)

nie jest to typ MIME albo Content-Type, to jest typ HTTP danych;

b)

nie jest to poprawne stwierdzenie, bo nie ma czegoś takiego jak response header;

c)

nie sposób tego określić

d)

jest to poprawne stwierdzenie;

e)

typ pliku nigdy nie ma znaczenia, gdyż zawsze to jest ten sam typ;

2.

Na rysunku przedstawiono schemat cyklu życia komponentu, gdzie zakreślono na czarno nazwy metod, które stanowią metody cyklu życia komponentu. 

(a)  

3.

Przestawiony fragment kodu można skomentować następująco: 

a)

Wyrenderuje reactowy element w węźle drzewa DOM, czyli najpierw przekaże element DOM do ReactDOM.createRoot(), a następnie przekaże element reactowy do root.render().

b)

Wyrenderuje reactowy element w węźle drzewa DOM, ale nie przekaże elementu DOM do ReactDOM.createRoot(), a następnie nie przekaże elementu reactowego do root.render().

c)

Nie wyrenderuje reactowego elementu w węźle drzewa DOM.

d)

Nie wyświetli się napis: Witaj, świecie!

e)

Wyświetli się migający i potem znikający napis: Witaj, świecie!

4.

Dopasuj następująceReact wyróżnia dwa typy komponentów ze względu na stan, co przedstawiono poniżej, w odpowiedzi podaj jaki typ komponentu jest widoczny po lewej stronie, a jaki typ po prawej stronie, wpisz dwa słowa oddzielone spacją 

(a)  

5.

W nierelacyjnych bazach danych stosujemy pojęcia: 

a)

tablica, wiersz, kolumna;

b)

kolekcja, dokument, klucz;

c)

komórka, klasa, tabela;

d)

wiersz, komórka, tablica;

e)

nie stosujemy żadnych pojęć

6.

Zamieszczone fragmenty kodu prezentują:

a)

Po lewej i po prawej jest kod JavaScript;

b)

Po lewej kod TypeScript, ponieważ nie zastosowano statycznego typowania; Po prawej kod JavaScript, ponieważ zastosowano statyczne typowanie.

c)

Po lewej i po prawej jest kod TypeScript;

d)

Po lewej kod JavaScript, ponieważ zastosowano statyczne typowanie; Po prawej kod TypeScript.

e)

Po lewej kod TypeScript, ponieważ zastosowano statyczne typowanie; Po prawej kod JavaScript.

7.

Autoryzacja i uwierzytelnienie, wybierz właściwą odpowiedź: 

a)

Autoryzacja to dodatkowy, inny sposób na uwierzytelnienie stosowany w celu zwiększenia bezpieczeństwa.

b)

Autoryzacja i uwierzytelnianie to proces potwierdzania deklarowanej tożsamości użytkownika, często za pomocą tajnych informacji.

c)

Autoryzacja i uwierzytelnianie mogą polegać na wprowadzeniu adresu e-mail na stronie logowania Google.

d)

Uwierzytelnienie odpowiada na pytanie „Kim jesteś?”, czyli pozwala na potwierdzanie tożsamości. Natomiast autoryzacja odpowiada na pytanie „Co możesz zrobić?”, co stanowi kontrolę dostępu do zasobów.

e)

Autoryzacja to proces potwierdzania tożsamości użytkownika, zwykle przez wymaganie od niego nazwy użytkownika i hasła, co prowadzi do tego, że uwierzytelnianie nie jest już potrzebne.

8.

Funkcje strzałkowe są współcześnie bardzo popularne i powszechnie stosowane. Warto jednak pamiętać o tym, że mają pewne ograniczenia względem klasycznych funkcji: 

a)

a) nie mogą być używane jako konstruktory (nie zadziała słówko new);

b)

b) nie są bindowane do this ani super, a więc nie powinny być używane jako metody, nie są też odpowiednie do wywołania przez call, apply czy używania metody bind;

c)

c) nie mają wsparcia dla słów kluczowych yield, arguments ani new.target;

d)

d) odpowiedzi a)–c) są prawdziwe.

e)

e) wszystkie odpowiedzi a)–c) są błędne.

9.

Hooki są funkcjami javascriptowymi, ale narzucają pewne dodatkowe zasady, które można krótko podsumować jako: 

a)

a. Wywołuj hooki tylko z najwyższego poziomu kodu. Nie wywołuj hooków z wewnątrz pętli, warunków czy zagnieżdżonych funkcji.

b)

b. Wywołuj hooki tylko z wewnątrz reactowych komponentów funkcyjnych. Nie wywołuj hooków z wewnątrz zwykłych javascriptowych funkcji (poza własnymi hookami).

c)

c. a i b są fałszywe

d)

d. a i b są prawdziwe

e)

e. prawdą jest tylko a

10.

Style CSS polegają na tym, że polecenia dotyczące formatowania umieszczamy w tzw. arkuszu i dzięki temu modyfikujemy wygląd stron, natomiast kaskadowość stylów określa: 

a)
  • nie ma czegoś takiego jak kaskadowość;

b)

pierwszeństwo zawsze mają style pochodzące z arkuszy zewnętrznych;

c)

pierwszeństwo w oddziaływaniu na te same elementy strony stylów z różnych źródeł, a jeśli w dokumencie jest więcej źródeł stylów, to pierwszeństwo mają te, które znajdują się "bliżej" formatowanego elementu;

d)

nie wiadomo co ją określa, nie zostało to bliżej określone;

e)

pierwszeństwo w oddziaływaniu na te same elementy strony stylów z tych samych źródeł, a jeśli w dokumencie jest więcej źródeł stylów, to pierwszeństwo mają te, które znajdują się "dalej" formatowanego elementu;

11.

Axios to moduł JavaScript, klient HTTP dla przeglądarki i NodeJS oparty na obietnicach. W 2015 został wydany Fetch.

Odpowiedź na ogólne pytanie: dlaczego cały czas używamy Axiosa? 

a)

Przy Fetch trzeba zająć się dwiema obietnicami, a przy Axios można uzyskać dostęp do wyniku JSON bezpośrednio z obiektu odpowiedzi przez właściwość data.Ponadto, Fetch nie wyrzuca błędów sieciowych, a Axios tak. Axios może monitorować postęp ładowania danych, czego nie umożliwia Fetch.

b)

Różnic jest co najmniej kilkanaście, ale decydujące znaczenie mają obowiązujące standardy i preferencje programistów.

c)

Pomimo wielu wad i niedogodności związanych z pisaniem kodu i jego wykonywaniem, jest to jak dotąd najbardziej popularne rozwiązanie.

d)

Tylko i wyłącznie ze względu na możliwość pisania krótszego kodu.

e)

Żeby pisać czystszy i bardziej zwięzły kod, choć nie ma to dużego znaczenia dla wykonywania kodu, bo poza tym istotnych różnic brak.

12.

Zamieszczone fragmenty kodu prezentują:

a)

Po lewej jest kod napisany bez zastosowania JSX, a po prawej jest kod napisany w JSX;

b)

Po lewej jest kod JavaScript, ponieważ zastosowano statyczne typowanie; Po prawej jest TypeScript.

c)

Po lewej jest kod TypeScript, ponieważ nie zastosowano statycznego typowania; Po prawej jest kod JavaScript, ponieważ zastosowano statyczne typowanie.

d)

Po lewej jest kod napisany w JSX, a po prawej jest kod bez zastosowania JSX.

e)

Po lewej jest kod TypeScript, ponieważ zastosowano statyczne typowanie; Po prawej jest kod JSX.

13.

Celowe łamanie kaskadowości można zrealizować poprzez: 

a)

nie jest możliwe złamanie tej zasady, gdyż utrudniałoby to analizę formatowania elementów;

b)

nie można złamać tej zasady, gdyż pojawiłoby się zbyt wiele błędów;

c)

zasada ta nie obowiązuje od HTML 5, który wyklucza kaskadowość;

d)

można złamać tę zasadę poprzez odpowiednie znaczniki;

e)

zastosowanie polecenia !important, gdy pojawia się ono po wartości cechy, to taka cecha będzie miała pierwszeństwo przed innymi, nawet gdy ma niższy priorytet;

14.

Dokument to podstawowa jednostka danych w nierelacyjnej bazie danych. Jest on przechowywany w formacie: 

a)

może to być każdy format, jednak rozmiar jest ograniczony;

b)

JSON (fizycznie BSON o maksymalnym rozmiarze 16 MB);

c)

nie ma takiego formatu i może przyjmować dowolny rozmiar;

d)

nie można go określić i nie można określić jego rozmiaru;

e)

zdefiniowanym przez użytkownika i o rozmiarze przez niego zdefiniowanym;

15.

Analizując powyższe, jak można stworzyć komponent kontrolowany w formularzu reactowym? Wybierz prawidłową odpowiedź: 

a)

W React należy dodać atrybut value na elemencie formularza.

b)

React należy dodać atrybut selected do dowolnego znacznika.

c)

W React należy dodać atrybut selected do znacznika select.

d)

W React nie należy dodać atrybutu value na elemencie formularza.

e)

Nie można poprawnie zbudować komponentu kontrolowanego w formularzu reactowym.

16.

Przedstawione fragmenty kodu można skomentować następująco:

a)

Zostały napisane z wykorzystaniem modyfikowanego HTMLa, a zastosowanie klamr w obydwu fragmentach kodu jest prawidłowe.

b)

Zostały napisane z wykorzystaniem czystego TypeScriptu, a zastosowanie klamr w obydwu fragmentach kodu jest błędne.

c)

Zostały napisane z wykorzystaniem JSX, czyli rozszerzenia składni JavaScriptu o możliwość wstawiania znaczników, a dowolne wyrażenie JavaScriptowe można osadzić w JSX poprzez otoczenie go klamrami.

d)

Zostały napisane z wykorzystaniem czystego JavaScriptu, a zastosowanie klamr w obydwu fragmentach kodu jest błędne.

e)

Zostały napisane z wykorzystaniem czystego JavaScriptu, a dowolnego wyrażenia JavaScriptowego nie można osadzić w JSX poprzez otoczenie go klamrami, dlatego kod napisany po prawej stronie jest błędny.

17.

Jednowątkowość JS polega na tym, że w danym momencie można wykonywać tylko jeden kod. 

a)

w JS nie ma takiej możliwości;

b)

tak, ale nie zawsze to jest możliwe;

c)

w JS Event Loop działa błędnie;

d)

nie, ponieważ JS jest wielowątkowy;

e)

w przypadku asynchroniczności działa zasada LIFO (Last In First Out);

18.

Czy w związku z powyższym możemy zapobiec renderowaniu komponentu, wybierz prawidłową odpowiedź:

a)

Tak, ponieważ może zachodzić potrzeba ukrycia komponentu, mimo iż został on już wyrenderowany przez inny komponent. Aby to umożliwić, należy zwrócić zamiast niego wartość null. Zwrócenie wartości null w metodzie render danego komponentu nie ma wpływu na wywoływanie metod cyklu życia tego komponentu.

b)

Nie, ponieważ nie ma poprawnego sposobu na ukrycie komponentu. Komponent zawsze musi być widoczny.

c)

Tak, ponieważ może nie zachodzić potrzeba ukrycia komponentu, mimo iż został on już wyrenderowany przez inny komponent. Aby to umożliwić, należy zwrócić zamiast niego error. Zwrócenie error w metodzie render danego komponentu nie ma wpływu na wywoływanie metod cyklu życia tego komponentu.

d)

Tak, ponieważ może nie zachodzić potrzeba ukrycia komponentu, mimo iż został on już wyrenderowany przez inny komponent. Aby to umożliwić, należy zwrócić zamiast niego wartość true. Zwrócenie wartości true w metodzie render danego komponentu nie ma wpływu na wywoływanie metod cyklu życia tego komponentu.

e)

Tak, ponieważ może zachodzić potrzeba ukrycia komponentu, mimo iż został on już wyrenderowany przez inny komponent. Aby to umożliwić, należy zwrócić zamiast niego wartość false. Zwrócenie wartości false w metodzie render danego komponentu nie ma wpływu na wywoływanie metod cyklu życia tego komponentu.

19.

Aplikacje RESTful zapewniają: 

a)

posiadają swoją specyfikację i nie spełniają żadnych reguł;

b)

niejednolity interfejs komunikacyjny, brak podziału na aplikacje klient-serwer, bezstanowość, cache danych, odseparowane warstwy;

c)

jednolity interfejs komunikacyjny, podział na aplikacje klient-serwer, bezstanowość, cache danych, odseparowane warstwy;

d)

nie posiadają swojej specyfikacji i nie spełniają żadnych reguł;

e)

podział na aplikacje klient-serwer, bezstanowość, cache danych, odseparowane warstwy, wysyłanie kodu do aplikacji klienta;

20.

Efektem działania obydwu fragmentów kodu jest wyświetlenie listy. Kod po lewej stronie używa funkcji map(() => ...). Zwraca element listy dla każdego elementu tablicy, a powstałą tablicę przypisuje do zmiennej listItems, a całą tablicę umieszcza wewnątrz elementu <ul>. Kod po prawej stronie zawiera komponent, który przyjmuje tablicę liczb i zwraca listę elementów. W tym kodzie przypisujemy właściwość (a)   do elementów listy wewnątrz numbers.map(), czyli naprawiliśmy w kodzie po prawej stronie problem brakującego klucza.

21.

Zamieszczone fragmenty kodu prezentują:

a)

Po lewej kod TypeScript, ponieważ nie zastosowano statycznego typowania; Po prawej kod JavaScript, ponieważ zastosowano statyczne typowanie.

b)

Po lewej i po prawej jest kod TypeScript;

c)

Po lewej kod JavaScript, ponieważ zastosowano statyczne typowanie; Po prawej kod TypeScript.

d)

Po lewej kod TypeScript, ponieważ zastosowano statyczne typowanie; Po prawej kod JavaScript.

e)

Po lewej i po prawej jest kod JavaScript;

22.

Analizując powyższe wybierz

a)

Funkcja reducer pełni rolę obiektu store architektury Flux. Dzięki temu, że jest to funkcja, można jej jednocześnie użyć jako funkcji wywołania zwrotnego, którą store uruchomi w momencie gdy zostanie rozgłoszona jakaś akcja. Funkcja ta przyjmuje dwa parametry: state oraz action.

b)

Redux jest uzależniony od ReactJS. W zasadzie nie można go używać z innymi frameworkami JavaScript.

c)

Redux nie może być opisany przez trzy fundamentalne zasady: 1) stan całej aplikacji przetrzymywany jest w drzewie obiektów wewnątrz pojedynczego obiektu store, 2) jedynym sposobem na zmianę stanu jest wywołanie akcji, która zwraca obiekt opisujący co powinno się stać, 3) aby określić, jak drzewo stanu transformowane jest przez akcje trzeba tworzyć "czyste reducery".

d)

Funkcja reducer nie pełni roli obiektu store architektury Flux. Dzięki temu, że jest to funkcja, można jej jednocześnie użyć jako funkcji wywołania zwrotnego, którą store uruchomi w momencie gdy zostanie rozgłoszona jakaś akcja. Funkcja ta nie przyjmuje żadnego parametru.

e)

Redux może być opisany przez trzy fundamentalne zasady: 1) stan całej aplikacji nie jest przetrzymywany w drzewie obiektów wewnątrz pojedynczego obiektu store, 2) niejedynym sposobem na zmianę stanu jest wywołanie akcji, która nie zwraca obiektu opisującego co powinno się stać, 3) aby określić, jak drzewo stanu transformowane jest przez akcje nie trzeba tworzyć "czystych reducerów".

23.

Hooki pozwalają na ponowne użycie logiki związanej ze stanem, bez konieczności zmiany hierarchii komponentów. Hooki pozwalają podzielić komponent na mniejsze funkcje. Dzięki hookom można oddelegować zarządzanie lokalnym stanem komponentu do reduktora (reducer, przykład powyżej).

Popularne hooki to:

a)

useState, useEffect, useContext, UserInfo, Comment, preventDefault, Axios i Enzyme;

b)

useState, useEffect, useContext, useReducer, useCallback, useRef, useTransition i useId;

c)

React DOM, React.createElement, UserInfo, Comment, preventDefault, useLayoutEffect i useMemo;

d)

combineReducers, useImperativeHandle, react-google-oauth, react-router-dom, useDebugValue i useTransition;

e)

Redux, mapStateToProps, componentDidMount, mapDispatchToProps, combineReducers i Flux;

24.

W przypadku protokołu HTTP, wśród nagłówków „response headers” należy zwrócić uwagę na Content-Type, który określa typ MIME danych. Jest to rodzaj danego pliku czy dokumentu, np. dokument HTML ma typ text/html, filmy mp4 mają typ video/mp4, a pliki dźwiękowe WAV mają audio/wav. Wybierz poprawne zdanie podsumowujące:

a)

nie jest to typ MIME albo Content-Type, to jest typ HTTP danych;

b)

nie jest to poprawne stwierdzenie, bo nie ma czegoś takiego jak response header;

c)

nie sposób tego określić;

d)

jest to poprawne stwierdzenie;

e)

typ pliku nigdy nie ma znaczenia, gdyż zawsze to jest ten sam typ;