Pytania do wywiadu React JS (2022)

Po rozmowie telefonicznej będziesz musiał stawić czoła rozmowie kwalifikacyjnej z typowymi pytaniami dotyczącymi Twoich kwalifikacji i umiejętności. Oprócz ogólnych przygotowań do pytań otwartych powinieneś także wiedzieć, jak odpowiadać na pytania techniczne.

Nawet jeśli odpowiadasz na pytania z pewnością siebie i charyzmą, musisz być dokładny, odpowiadając na pytania techniczne. Przygotowaliśmy dla Ciebie kilka pytań technicznych, które możesz przygotować przed stawieniem się na rozmowę kwalifikacyjną.

Potraktuj je jako przykłady pytań, których możesz się spodziewać podczas rozmowy kwalifikacyjnej React JS.

P.1) Wyjaśnij różnicę między rzeczywistym DOM a wirtualnym DOM?

Odp.: Virtual DOM aktualizuje się szybciej, ale nie może bezpośrednio aktualizować kodu HTML. Może aktualizować JSX, jeśli elementy są aktualizowane. Jest to doskonała opcja, jeśli nie chcesz marnować pamięci, a także łatwo nią manipulować.

Z drugiej strony aktualizacje Real DOM są wolniejsze, ale mogą bezpośrednio aktualizować kod HTML. Jednak nie są one opłacalne, ponieważ modele DOM utworzone z aktualizacji elementów są kosztowne w manipulacji. Oprócz tego Real DOM wymaga również dużo miejsca do przechowywania.

P.2) Jak opisałbyś „React”?

Odp.: Reach został opracowany przez Facebooka, który stosuje podejście oparte na komponentach, które pomaga w tworzeniu komponentów interfejsu użytkownika wielokrotnego użytku. Jest to front-endowa biblioteka JavaScrip używana do tworzenia złożonego mobilnego interfejsu użytkownika i interaktywnej sieci. React był open-source w 2015 roku, a dziś ma szerokie wsparcie społeczności.

P.3) Czy możesz nam powiedzieć o głównych zaletach korzystania z Reacta?

Odp.: React zwiększa wydajność działania aplikacji, a ponadto możesz go używać zarówno po stronie klienta, jak i serwera. Kody napisane w React są czytelne dzięki JSX, a pisanie testów interfejsu użytkownika staje się bezproblemowe. Z łatwością można zintegrować React z innymi frameworkami, takimi jak Angular i Meteor.

P.4) Jakie są trzy główne cechy Reacta?

Odp: React używa wirtualnego DOM zamiast prawdziwego DOM. Podąża za wiązaniem danych lub jednokierunkowym przepływem podczas korzystania z renderowania po stronie serwera,

P.5) Czy uważasz, że React ma jakieś ograniczenia?

Odp: Tak, myślę, że początkującemu programiście trudno jest pojąć, a kodowanie może stać się niezwykle trudne ze względu na JSX i wbudowane szablony. Ponadto, ponieważ jest to rozbudowany framework, zapoznanie się z Reactem wymaga czasu.

Q.6) Opisz wirtualny DOM i jego działanie.

Odp.: Wirtualny DOM jest kopią prawdziwego DOM i jest lekkim obiektem JavaScript. Jest to drzewo węzłów, które wymienia wszystkie atrybuty, zawartość i elementy jako obiekty wraz z ich właściwościami. Funkcja render w React tworzy drzewo węzłów z jego komponentów. Gdy użytkownik lub system wykonuje wiele działań, aktualizuje drzewo, aby reagować na mutację modelu danych.

Działanie wirtualnego DOM przebiega w trzech krokach:

1. Po pierwsze, cały interfejs użytkownika jest renderowany w reprezentacji wirtualnego DOM, nawet w przypadku niewielkich zmian w danych.
2. Tworzy to różnicę między reprezentacją nowego i poprzedniego DOM, która jest obliczana.
3. Prawdziwy DOM jest aktualizowany tylko o rzeczy, które zostały zmienione po zakończeniu obliczeń.

P.7) Powiedz nam, co wiesz o JSX?

Odp: JSX to plik, którego React używa wraz ze składnią szablonu podobną do HTML, aby wykorzystać ekspresję javascript. Jest to skrót dla JavaScript SML, który sprawia, że ​​każdy plik HTML jest łatwy do zrozumienia. JSX służy do zwiększania wydajności i wydajności aplikacji.

P.8) Wyjaśnij różnicę między Reactem a Angularem.

Odp.: Istnieje kilka głównych różnic między Reactem i Angularem, na przykład architektura, w której ten pierwszy ma tylko widok MVC, podczas gdy drugi otrzymuje widok pełnego MVC. Jeśli chodzi o renderowanie, Angular ma renderowanie po stronie klienta, a React korzysta z renderowania po stronie serwera. React używa wirtualnego DOM i jednokierunkowego wiązania danych, Angular używa prawdziwego DOM z dwukierunkowym wiązaniem danych. Debugowanie w Angularze to debugowanie w czasie wykonywania, podczas gdy React ma debugowanie w czasie kompilacji. Wreszcie, Google stworzył Angulara, a za zbudowanie Reacta zasługuje Facebook.

P.9) Co rozumiemy przez rekwizyty?

Odp.: Rekwizyty to komponenty tylko do odczytu, które powinny być niezmienne lub czyste, i jest to skrót od „Właściwości w reakcji”. W aplikacji są one wysyłane od rodzica do komponentu podrzędnego, co pomaga w utrzymaniu jednokierunkowego przepływu danych. Rekwizyty pomagają również w renderowaniu danych, które są generowane dynamicznie.

P.10) Czym są stany w React i jak ich używać?

Odp.: Stany są duszą komponentów Reacta, należy je uprościć, ponieważ są źródłem danych. Można powiedzieć, że stany to obiekty, które określają zachowanie i renderowanie komponentów. Zmiany stanu można wprowadzać, ponieważ są one zmienne i wydajne w tworzeniu interaktywnych i dynamicznych komponentów.

P.11) Jakie są główne różnice między stanami a rekwizytami?

Odp: Komponent nadrzędny w props może zmienić wartość, podczas gdy nie może się to zdarzyć w stanie. Jednak wewnątrz komponentów stanu zachodzą zmiany, ale w przypadku rekwizytów tak nie jest. Podobnie jak komponent rodzica, komponent potomny również nie ma żadnych zmian, ale można je zaobserwować w rekwizytach.

P.12) Jakie są podobieństwa stanu i rekwizytów?

Odp: Istnieją głównie trzy podobieństwa między stanem a rekwizytami.

1. Oboje otrzymują wartość początkową od komponentu nadrzędnego.
2. W obu przypadkach można ustawić wartości domyślne wewnątrz komponentów.
3. W komponencie potomnym możesz z łatwością ustawić wartość początkową.

P.13) Co to są komponenty stanowe?

Odp.: Zmiana stanu w pamięci komponentów jest przechowywana przez komponent stanowy, mają również uprawnienia do zmiany stanu i są świadome wszystkich zmian występujących w stanie. Komponenty bezstanowe wysyłają rekwizyty po powiadomieniu ich o potrzebnej zmianie stanu.

P.14) Co rozumiemy przez komponenty bezstanowe?

Odp.: Wewnętrzny stan komponentów jest obliczany przez komponenty bezstanowe i nie mają uprawnień do zmiany stanu. Brakuje im wiedzy o obecnych, przeszłych i przyszłych zmianach stanu. Wreszcie komponenty stanowe wysyłają im propsy, które traktują jako funkcje zwrotne.

P.15) Opisz zdarzenia syntetyczne.

Odp.: Obiekty, które zachowują się jak owijka między przeglądarkami wokół natywnego zdarzenia przeglądarki, są nazywane zdarzeniami syntetycznymi. Ich kluczową funkcją jest stworzenie jednego API poprzez połączenie zachowania wielu przeglądarek. Zapewnia to spójne właściwości w zdarzeniach w różnych przeglądarkach.

P.16) Czym są referencje i kiedy należy ich używać?

Odp: Ref oznacza Referencje w React i jest to atrybut, który przechowuje odniesienie do konkretnego komponentu lub elementu reakcji. Funkcja konfiguracji renderowania w komponentach zwraca te odwołania. Pomagają dodawać metody do istotnych komponentów i uzyskiwać pomiary DOM. Możemy również użyć referencji, aby zarządzać fokusem, wybierać odtwarzanie multimediów lub tekst. Ponadto pomagają również w integracji z bibliotekami DOM innych firm i wyzwalaniu imperatywnych animacji.

P.17) Czym są kontrolowane komponenty?

Odp.: Komponenty kontrolne nie mogą zachować swojego stanu, a komponent nadrzędny kontroluje dane. Ponadto uzyskują bieżące wartości za pomocą rekwizytów i używają wywołań zwrotnych do powiadamiania o zmianach.

P.18) Co wiesz o niekontrolowanych komponentach?

Odp.: Niekontrolowane komponenty zachowują swój stan. Tutaj DOM kontroluje dane, w przeciwieństwie do kontrolowanych komponentów. Używają również ref, aby wyprowadzić swoje aktualne wartości.

Pytanie 19) Podaj zalety Redux.

Odp.: Redux oferuje następujące zalety –

• Organizacja : Praca zespołowa staje się łatwiejsza w Redux, ponieważ jest ona szczególna w organizacji kodu, dzięki czemu jest bardziej spójny.
• Łatwy do testowania : kod jest niezależny i testowalny, ponieważ zawiera izolowane, małe i czyste funkcje.
• Społeczność : Redux ma kopię zapasową dużej i utalentowanej społeczności, która stale ulepsza bibliotekę podczas tworzenia wielu aplikacji.
• Narzędzia programistyczne : programiści mogą łatwo śledzić wszystko w aplikacji, od zmian stanu po działania.
• Renderowanie po stronie serwera : w redux wystarczy wysłać sklep po stronie klienta, co zapewnia lepsze wrażenia użytkownika, ponieważ zwiększa się wydajność aplikacji.
• Utrzymanie : kod ma ścisłą strukturę i przewidywalny wynik, co ułatwia jego utrzymanie.
• Przewidywalność wyników : synchronizacja bieżącej akcji stanu z częściami aplikacji nie stanowi zamieszania, ponieważ istnieje tylko jedno źródło przechowywania.

Wniosek

Nauka React Js nie jest skomplikowana, jeśli jesteś wytrwały i oddany. Gdy już poznasz swój język programowania od podszewki, możesz z łatwością złamać każdy wywiad. Jeśli dopiero teraz zgłębiasz język lub chcesz pogłębić swoją wiedzę, sprawdź nasz tytuł Master of Science in Computer Science z Liverpool John Moore University. Ten 19-miesięczny kurs obejmuje niektóre z najpopularniejszych narzędzi, w tym React, Java, JavaScript, Spring, Hyperledger i Ethereum, żeby wymienić tylko kilka.

Po ukończeniu tego kursu zdobędziesz głębokie zrozumienie React. Co więcej, będziesz kwalifikować się do objęcia wysoko płatnych stanowisk, takich jak programista/inżynier, programista Full Stack, programista Blockchain, ekspert/architekt w chmurze, inżynier ds. bezpieczeństwa cybernetycznego, inżynier danych i inżynier DevOps.