74 najpopularniejszych pytań i odpowiedzi związanych z rozmowami kwalifikacyjnymi React JS

Reaguj na pytania i odpowiedzi podczas rozmowy kwalifikacyjnej

Oto pytania i odpowiedzi dotyczące rozmów kwalifikacyjnych w ReactJs, zarówno dla nowicjuszy, jak i doświadczonych kandydatów, którzy chcą zdobyć wymarzoną pracę.

1) Co to jest Reactjs?

React to biblioteka JavaScript, która ułatwia tworzenie interfejsów użytkownika. Został opracowany przez Facebooka.

---

2) Czy React używa HTML?

Nie, używa JSX, który jest podobny do HTML.

Bezpłatne pobieranie plików PDF: Reaguj na pytania i odpowiedzi podczas rozmowy kwalifikacyjnej

---

3) Kiedy po raz pierwszy wydano React?

React został po raz pierwszy wydany w marcu 2013 roku.

---

4) Podaj mi dwie najważniejsze wady Reacta

• Integracja Reacta ze frameworkiem MVC, takim jak Rails, wymaga złożonej konfiguracji.
• React wymaga od użytkowników wiedzy na temat integracji interfejsu użytkownika z frameworkiem MVC.

---

5) Podaj różnicę pomiędzy prawdziwym DOM i wirtualnym DOM

Prawdziwy DOM	Wirtualny DOM
Jest aktualizowany powoli.	Aktualizuje się szybciej.
Umożliwia bezpośrednią aktualizację z poziomu HTML.	Nie można go używać do bezpośredniej aktualizacji kodu HTML.
To marnuje zbyt dużo pamięci.	Zużycie pamięci jest mniejsze

---

6) Czym jest koncepcja Flux w React?

Facebook powszechnie wykorzystuje koncepcję architektury Flux do tworzenia aplikacji webowych po stronie klienta. Nie jest to framework ani biblioteka. To po prostu nowy rodzaj architektury, który uzupełnia React i koncepcję jednokierunkowego przepływu danych (Unidirectional Data Flow).

---

7) Zdefiniuj termin Redux w React

Redux to biblioteka używana do programowania front-endu. Jest to kontener stanu dla aplikacji JavaScript, który powinien być używany do zarządzania stanem aplikacji. Możesz testować i uruchamiać aplikację opracowaną w Redux w różnych środowiskach.

---

8) Jaka jest funkcja „Sklep” w Redux?

Redux posiada funkcję o nazwie „Sklep”, która pozwala zapisać cały stan aplikacji w jednym miejscu. Dlatego też stan wszystkich komponentów jest przechowywany w Sklepie, dzięki czemu będziesz otrzymywać regularne aktualizacje bezpośrednio ze Sklepu. Pojedyncze drzewo stanów pomaga śledzić zmiany w czasie i debugować lub sprawdzać aplikację.

---

9) Czym jest akcja w Reduxie?

Jest to funkcja zwracająca obiekt akcji. Typ akcji i dane akcji są zawsze przechowywane w obiekcie akcji. Akcje mogą przesyłać dane pomiędzy Sklepem a aplikacją. Wszelkie informacje pobierane przez Sklep powstają w wyniku działań.

---

10) Wymień ważne cechy React

Oto ważne cechy React.

• Umożliwia korzystanie z bibliotek stron trzecich
• Oszczędność czasu
• Szybszy rozwój
• Prostota i możliwość komponowania
• W pełni wspierany przez Facebooka.
• Stabilność kodu z jednokierunkowym wiązaniem danych
• Komponenty reakcji

---

11) Wyjaśnij termin komponenty bezstanowe

Komponenty bezstanowe to czyste funkcje, które renderują DOM wyłącznie na podstawie dostarczonych im właściwości.

---

12) Wyjaśnij router React

React Router to biblioteka routingu, która pozwala dodawać nowe przepływy ekranów do aplikacji, a także synchronizuje adresy URL z tym, co jest wyświetlane na stronie.

---

13) Jakie są popularne pakiety animacji w ekosystemie React?

Popularnymi pakietami animacji w ekosystemie React są

• Reaguj na ruch
• Grupa Przejściowa Reaguj

---

14) Co to jest Jest?

Jest to framework do testów jednostkowych JavaScript stworzony przez Facebooka w oparciu o Jasmine. Oferuje automatyczne tworzenie makiet i środowisko jsdom. Jest również używany jako komponent testowy.

---

15) Kim jest dyspozytor?

Dyspozytor to centralne centrum aplikacji, w którym będziesz otrzymywać działania i przesyłać ładunek do zarejestrowanych wywołań zwrotnych.

---

16) Co oznacza funkcja wywołania zwrotnego? Jaki jest jego cel?

Funkcja wywołania zwrotnego powinna zostać wywołana po zakończeniu setState i ponownym renderowaniu komponentu. Ponieważ setState jest asynchroniczny, dlatego przyjmuje drugą funkcję wywołania zwrotnego.

---

17) Wyjaśnij pojęcie komponent wyższego rzędu

Komponent wyższego rzędu, znany również w skrócie jako HOC, to zaawansowana technika ponownego wykorzystania logiki komponentów. To nie jest część React API, ale są one wzorem wyłaniającym się z kompozycyjnej natury Reacta.

---

18) Wyjaśnij segment prezentacyjny

Część prezentacyjna to segment umożliwiający renderowanie kodu HTML. Pojemność segmentu jest prezentowana w znacznikach.

---

19) Czym są rekwizyty w reakcji js?

Rekwizyty oznaczają właściwości, czyli sposób przekazywania danych z komponentu nadrzędnego do potomnego. Można powiedzieć, że rekwizyty to po prostu kanał komunikacji między komponentami. Zawsze przemieszczają się od komponentu nadrzędnego do potomnego.

---

20) Jakie jest zastosowanie super słowa kluczowego w React?

Słowo kluczowe super pomaga uzyskać dostęp do funkcji obiektu nadrzędnego i wywołać je.

---

21) Wyjaśnij hasło „profit” w JavaScript

Hasło „profit” służy do opóźniania i CV praca generatorowa, znana jako hasło „profit”.

---

22) Wymień dwa typy komponentów React

Dwa rodzaje komponentów reagujących to:

• Składnik funkcyjny
• Składnik klasowy

---

23) Wyjaśnij zdarzenie syntetyczne w React js

Zdarzenie syntetyczne to rodzaj obiektu, który działa jak opakowanie (wrapper) dla natywnego zdarzenia przeglądarki. Pomaga nam również łączyć zachowania różnych przeglądarek w API sygnałów.

---

24) Co to jest stan reakcji?

Jest to obiekt, który decyduje o tym, jak dany komponent będzie renderowany i jak się zachowa. Stan przechowuje informacje, które można zmieniać przez cały czas życia komponentu React.

---

25) Jak zaktualizować stan w reakcji js?

Stan komponentu można aktualizować bezpośrednio lub pośrednio.

---

26) Wyjaśnij użycie funkcji strzałki w React

Funkcja strzałki pomaga przewidzieć zachowanie błędów przekazywanych jako wywołanie zwrotne. Dlatego zapobiega to błędom powodowanym przez to wszystko razem.

---

27) Jakie są etapy cyklu życia React?

Ważne etapy cyklu życia React js to:

• Inicjalizacji
• Aktualizacje stanu/właściwości
• Zniszczenie to cykl życia React

---

28) Podaj główną różnicę między zaletami a stanem

Główna różnica polega na tym, że stan jest zmienny, a zalety niezmienne.

---

29) Wyjaśnij czyste komponenty w React js

Czyste komponenty to najszybsze komponenty, które mogą zastąpić dowolny komponent samą funkcją render(). Pomaga zwiększyć prostotę kodu i wydajność aplikacji.

---

30) Jakie informacje kontrolują segment w React?

Segmentem kontrolują głównie dwa rodzaje informacji: stan i właściwości

• Stan: Podaj informacje, które ulegną zmianie, musimy wykorzystać Stan.
• Rekwizyty: Rekwizyty są ustawiane przez rodzica i rozliczane przez cały okres istnienia części.

---

31) Co to jest „tworzenie-reagowanie-aplikacja”?

„create-react-app” to narzędzie wiersza poleceń, które umożliwia utworzenie jednej podstawowej aplikacji reagującej.

---

32) Wyjaśnij użycie „klucza” na liście reakcji

Klucze umożliwiają nadanie każdemu elementowi listy stabilnej tożsamości. Klucze powinny być unikalne.

---

33) Czym są rekwizyty dla dzieci?

Rekwizyty podrzędne służą do przekazywania komponentu do innych komponentów jako właściwości. Dostęp do niego uzyskasz za pomocą

{props.children}

---

34) Wyjaśnij granice błędów?

Granice błędów pomagają wychwycić błąd JavaScript w dowolnym miejscu komponentów potomnych. Są one najczęściej używane do rejestrowania błędów i pokazywania zastępczego interfejsu użytkownika.

---

35) Jaki jest pożytek z pustych tagów <> ?

Puste tagi są używane w React do deklarowania fragmentów.

---

36) Wyjaśnij tryb ścisły

StrictMode umożliwia uruchamianie kontroli i ostrzeżeń dla komponentów reagujących. Działa tylko w wersji rozwojowej. Pomaga podkreślić problemy bez renderowania widocznego interfejsu użytkownika.

---

37) Czym są portale reagujące?

Portal umożliwia renderowanie elementów podrzędnych w węźle DOM. Metoda tworzenia portalu jest do tego używany.

---

38) Co to jest kontekst?

Kontekst React pomaga przekazywać dane za pomocą drzewa komponentów React. Pomaga w globalnym udostępnianiu danych pomiędzy różnymi komponentami reakcji.

---

39) Jakie jest zastosowanie pakietu internetowego?

Webpack w zasadzie jest narzędziem do tworzenia modułów. Jest uruchamiany głównie podczas procesu programowania.

---

40) Czym jest Babel w React js?

Babel to kompilator JavaScript, który konwertuje najnowszy JavaScript, taki jak ES6, ES7, na zwykły stary JavaScript ES5, zrozumiały dla większości przeglądarek.

---

41) Jak przeglądarka może odczytać plik JSX?

Jeśli chcesz, aby przeglądarka czytała JSX, plik JSX powinien zostać zastąpiony za pomocą transformatora JSX, takiego jak Babel, a następnie odesłany do przeglądarki.

---

42) Jakie są główne problemy związane z wykorzystaniem architektury MVC w React?

Oto główne wyzwania, przed którymi staniesz podczas obsługi architektury MVC:

• Obsługa DOM jest dość droga
• W większości przypadków aplikacje były powolne i nieefektywne
• Dzięki funkcjom kołowym wokół modeli i pomysłów stworzono złożony model

---

43) Co można zrobić, gdy istnieje więcej niż jedna linia wyrazu?

W tym momencie pozostaje Ci jedynie wieloliniowe wyrażenie JSX.

---

44) Jaka jest redukcja?

Redukcja jest metodą stosowania obsługi stanu.

---

45) Wyjaśnij termin zdarzenia syntetyczne

W rzeczywistości jest to opakowanie dla różnych przeglądarek wokół natywnego zdarzenia przeglądarki. Zdarzenia te mają interfejs stopPropagation() i PreventDefault().

---

46) Kiedy należy używać elementów najwyższej klasy jako elementu funkcyjnego?

Jeśli Twój element przechodzi etap lub cykl życia, powinniśmy zastosować elementy najwyższej klasy.

---

47) Jak możesz udostępnić element podczas analizowania?

Korzystając ze stanu, możemy udostępniać dane.

---

48) Wyjaśnij pojęcie pojednania

Gdy stan komponentu lub właściwości się zmienią, rest porówna wyrenderowany element z wcześniej wyrenderowanym modelem DOM i zaktualizuje rzeczywisty model DOM, jeśli będzie potrzebny. Proces ten nazywany jest pojednaniem.

---

49) Jak możesz ponownie wyrenderować komponent bez użycia funkcji setState()?

Możesz użyć funkcji forceUpdate() do ponownego renderowania dowolnego komponentu.

---

50) Czy możesz aktualizować rekwizyty w reakcji?

Nie możesz aktualizować rekwizytów w reakcji js, ponieważ rekwizyty są tylko do odczytu. Co więcej, nie można modyfikować rekwizytów otrzymanych od rodzica do dziecka.

---

51) Wyjaśnij pojęcie „Restrukturyzacja”.

Restrukturyzacja to proces ekstrakcji szyk obiekty. Po zakończeniu procesu możesz oddzielić każdy obiekt w osobnej zmiennej.

---

52) Czy możesz zaktualizować wartości właściwości?

Nie można zaktualizować wartości właściwości, ponieważ jest ona niezmienna.

---

53) Wyjaśnij znaczenie montażu i demontażu

• Proces mocowania elementu do DCOM nazywa się montażem.
• Proces odłączania elementu od DCOM nazywany jest procesem demontażu.

---

54) Jakie jest zastosowanie biblioteki „prop-types”?

Biblioteka „Prop-types” umożliwia sprawdzanie typów rekwizytów i podobnych obiektów w najnowszej aplikacji w czasie wykonywania.

---

55) Wyjaśnij haki reagujące

Haki React umożliwiają używanie stanu i innych funkcji React bez pisania klasy.

---

56) Czym są fragmenty?

Możesz użyć słowa kluczowego fragment, aby pogrupować listę komponentów potomnych bez używania dodatkowych węzłów w DOM. Na przykład :

render() {

return (
);
}

---

57) Jaka jest główna różnica pomiędzy createElement i cloneElment?

• createElement jest używany przez reakcję do tworzenia elementów reagujących.
• cloneElement służy do klonowania elementu i przekazywania mu nowych właściwości.

---

58) Czym są kontrolowane komponenty?

Komponenty kontrolowane to komponenty sterujące elementami wejściowymi.

---

59) Dlaczego musisz używać props.children?

Ten plik props.children umożliwia przekazywanie komponentu jako danych do innych komponentów.

---

60) Wypisz niektóre metody z pakietu React-dom

Ważnymi metodami pakietów React-dom są:

• renderowanie()
• hydrat()
• utwórzPortal()
• odmontujKomponentAtNode()
• znajdźDOMNode()

---

61) Jak możemy wykonać renderowanie po stronie serwera w React?

Możemy użyć funkcji reakcji do renderowania po stronie serwera.

---

62) Podaj różnicę między getInitialState() a konstruktorem()?

Jeśli chcesz utworzyć jeden komponent, rozszerzając „React. Component”, konstruktor pomaga zainicjować stan. Ale jeśli chcesz tworzyć przy użyciu „Reat.createClass”. wówczas powinieneś użyć „genInitiaState”.

---

63) Co to jest ref?

Ref są atrybutami elementów DOM. Głównym celem refów jest łatwe znalezienie elementów DOM.

---

64) Co to jest ComponentWillMount()

ComponentWillMount() polega na wykonywaniu wywołań API po zainicjowaniu komponentu i skonfigurowaniu wartości do stanu. Aby wykonać wywołanie API, użyj HttpClient, takiego jak Axios, lub możemy użyć fetch() w celu uruchomienia wywołania AJAX.

---

65) Jak wysłać dane w sklepie?

Możemy wysłać dane do innego komponentu, który powinien opierać się na akcji przechowującej komponent nadrzędny.

---

66) Jak będziesz w stanie obsłużyć więcej akcji za pomocą reduxu?

Aby stworzyć ten sam komponent w większej liczbie akcji, używamy tej samej funkcjonalności w różnych modułach.

---

67) Jak rozlać reduktory?

Możemy rozdzielić akcje ratunkowe na podstawie działań związanych ze zdarzeniem. Działanie to należy podzielić na osobne moduły.

---

68) Wymień pięć predefiniowanych prototypów używanych w React

Najważniejsze prototypy użyte w React js to:

• numer
• ciąg
• szyk
• przedmiot
• element

---

69) Jaki jest cel korzystania z bindActionsCreators?

BindActionCreator pomaga powiązać zdarzenie na podstawie modułu rozsyłającego akcję z elementem HTML.

---

70) Co to jest REFS w React

Ref jest referencją do elementu. W większości przypadków należy tego unikać. Czasami jednak używa się go, gdy trzeba uzyskać bezpośredni dostęp do modelu DOM lub instancji komponentu.

---

71) Czy element JSX można dołączyć do innych komponentów JSX?

Tak, możesz użyć dołączonego elementu JSX z innymi komponentami JSX, co jest bardzo podobne do zagnieżdżania elementów HTML.

---

72) Jaka jest aktualna stabilna wersja React?

Obecna stabilna wersja Reacta to wersja 17.5

---

73) Wymień ważną cechę funkcji przepływu pracy Redux

Ważnymi cechami przepływu pracy Redux są:

• Resetuj: pomaga zresetować stan sklepu
• Przywróć: umożliwia przywrócenie ostatniego zatwierdzonego stanu
• Sweep: Wszystkie działania wyłączające, które możesz uruchomić przez pomyłkę, zostaną usunięte
• Zatwierdzenie: pomaga ustawić bieżący stan na stan początkowy.

---

74) Podaj różnicę pomiędzy React JS i React Native

React JS to frontendowa biblioteka JavaScript o otwartym kodzie źródłowym, używana do tworzenia interfejsów użytkownika, podczas gdy React Native to mobilna platforma typu open source, która umożliwia programistom reagowanie na platformach takich jak Android i iOS. Te pytania do rozmowy kwalifikacyjnej pomogą również w Twoim viva (ustnie)