Die 74 wichtigsten Fragen und Antworten zu React JS-Interviews

Reagieren Sie auf Fragen und Antworten im Vorstellungsgespräch

Hier finden Sie Fragen und Antworten zu Vorstellungsgesprächen von ReactJ für Studienanfänger und erfahrene Kandidaten, die ihren Traumjob bekommen möchten.

1) Was ist Reactjs?

React ist eine JavaScript-Bibliothek, die die Erstellung von Benutzeroberflächen vereinfacht. Es wurde von Facebook entwickelt.

---

2) Wird React verwendet? HTML?

Nein, es wird JSX verwendet, das HTML ähnelt.

Kostenloser PDF-Download: Reagieren Sie auf Fragen und Antworten im Vorstellungsgespräch

---

3) Wann wurde React zum ersten Mal veröffentlicht?

React wurde erstmals im März 2013 veröffentlicht.

---

4) Nennen Sie mir zwei der größten Nachteile von React

• Die Integration von React in das MVC-Framework wie Rails erfordert eine komplexe Konfiguration.
• React erfordert von den Benutzern Kenntnisse über die Integration der Benutzeroberfläche in das MVC-Framework.

---

5) Nennen Sie den Unterschied zwischen echtem DOM und virtuellem DOM

Echte DOM	Virtuelles DOM
Es wird langsam aktualisiert.	Es wird schneller aktualisiert.
Es ermöglicht eine direkte Aktualisierung aus HTML.	Es kann nicht zum direkten Aktualisieren von HTML verwendet werden.
Es verschwendet zu viel Speicher.	Der Speicherverbrauch ist geringer

---

6) Was ist das Flux-Konzept in React?

Facebook nutzt das Flux-Architekturkonzept häufig für die Entwicklung clientseitiger Webanwendungen. Es handelt sich dabei nicht um ein Framework oder eine Bibliothek. Es handelt sich lediglich um eine neue Art von Architektur, die React und das Konzept des unidirektionalen Datenflusses ergänzt.

---

7) Definieren Sie den Begriff Redux in React

Redux ist eine Bibliothek, die für die Frontend-Entwicklung verwendet wird. Es handelt sich um einen Statuscontainer für JavaScript-Anwendungen, der für die Statusverwaltung der Anwendungen verwendet werden sollte. Sie können eine mit Redux entwickelte Anwendung in verschiedenen Umgebungen testen und ausführen.

---

8) Was ist die „Store“-Funktion in Redux?

Redux verfügt über eine Funktion namens „Store“, mit der Sie den gesamten Status der Anwendung an einem Ort speichern können. Daher wird der Status aller Komponenten im Store gespeichert, sodass Sie regelmäßig Updates direkt vom Store erhalten. Der einzelne Statusbaum hilft Ihnen, Änderungen im Laufe der Zeit zu verfolgen und die Anwendung zu debuggen oder zu überprüfen.

---

9) Was ist eine Aktion in Redux?

Es handelt sich um eine Funktion, die ein Aktionsobjekt zurückgibt. Der Aktionstyp und die Aktionsdaten werden immer im Aktionsobjekt gespeichert. Aktionen können Daten zwischen dem Store und der Softwareanwendung senden. Alle vom Store abgerufenen Informationen werden durch die Aktionen erzeugt.

---

10) Nennen Sie die wichtigen Funktionen von React

Hier sind wichtige Funktionen von React.

• Ermöglicht die Verwendung von Bibliotheken von Drittanbietern
• Zeitersparnis
• Schnellere Entwicklung
• Einfachheit und Zusammensetzbarkeit
• Vollständig unterstützt von Facebook.
• Codestabilität mit unidirektionaler Datenbindung
• Komponenten reagieren

---

11) Erklären Sie den Begriff zustandslose Komponenten

Zustandslose Komponenten sind reine Funktionen, die DOM-basiert ausschließlich auf der Grundlage der ihnen bereitgestellten Eigenschaften rendern.

---

12) Erklären Sie den React Router

React Router ist eine Routing-Bibliothek, die es Ihnen ermöglicht, Ihrer Anwendung neue Bildschirmabläufe hinzuzufügen, und die außerdem dafür sorgt, dass die URL mit dem, was auf der Seite angezeigt wird, synchronisiert wird.

---

13) Was sind die beliebten Animationspakete im React-Ökosystem?

Beliebte Animationspakete im React-Ökosystem sind

• Reagieren Sie auf Bewegung
• Reaktionsübergangsgruppe

---

14) Was ist Scherz?

Jest ist ein von Facebook basierendes JavaScript-Unit-Test-Framework, das auf Jasmine basiert. Es bietet eine automatisierte Mock-Erstellung und eine JSDOM-Umgebung. Es wird auch als Testkomponente verwendet.

---

15) Was ist ein Dispatcher?

Ein Dispatcher ist ein zentraler App-Hub, an dem Sie Aktionen empfangen und Nutzdaten an registrierte Rückrufe senden.

---

16) Was versteht man unter Callback-Funktion? Was ist seine Aufgabe?

Eine Rückruffunktion sollte aufgerufen werden, wenn setState beendet ist und die Komponente erneut gerendert wird. Da der setState asynchron ist, nimmt er eine zweite Callback-Funktion auf.

---

17) Erklären Sie den Begriff Komponente hoher Ordnung

Eine Komponente höherer Ordnung, auch kurz HOC genannt, ist eine fortschrittliche Technik zur Wiederverwendung der Komponentenlogik. Es ist nicht Teil der Reaktion API, aber sie sind ein Muster, das sich aus der kompositorischen Natur von React ergibt.

---

18) Erklären Sie das Präsentationssegment

Ein Präsentationsteil ist ein Segment, mit dem Sie HTML rendern können. Die Kapazität des Segments ist im Markup repräsentativ.

---

19) Was sind Requisiten in React JS?

Props bedeuten Eigenschaften, die eine Möglichkeit darstellen, Daten vom übergeordneten zum untergeordneten Element weiterzugeben. Man kann sagen, dass Props lediglich ein Kommunikationskanal zwischen Komponenten sind. Sie bewegen sich ständig vom übergeordneten zum untergeordneten Element.

---

20) Wozu dient ein Super-Keyword in React?

Mit dem Schlüsselwort super können Sie auf Funktionen des übergeordneten Objekts zugreifen und diese aufrufen.

---

21) Erklären Sie das Schlagwort „Yield“ in JavaScript

Das Schlagwort „Yield“ wird verwendet, um zu verzögern und fortsetzen eine Generatorarbeit, die als Yield-Schlagwort bekannt ist.

---

22) Nennen Sie zwei Arten von React-Komponenten

Zwei Arten von Reaktionskomponenten sind:

• Funktionskomponente
• Klassenkomponente

---

23) Erklären Sie das synthetische Ereignis in React js

Ein synthetisches Ereignis ist eine Art Objekt, das als browserübergreifender Wrapper um das native Ereignis des Browsers fungiert. Es hilft uns auch, das Verhalten verschiedener Browser in der Signal-API zu kombinieren.

---

24) Was ist der Reaktionszustand?

Es ist ein Objekt, das entscheidet, wie eine bestimmte Komponente gerendert wird und wie sie sich verhält. Der Status speichert die Informationen, die im Laufe der Lebensdauer einer React-Komponente geändert werden können.

---

25) Wie können Sie den Status in React JS aktualisieren?

Ein Status kann direkt oder indirekt auf der Komponente aktualisiert werden.

---

26) Erklären Sie die Verwendung der Pfeilfunktion in React

Mithilfe der Pfeilfunktion können Sie das Verhalten von Fehlern vorhersagen, wenn sie als Rückruf übergeben werden. Daher werden dadurch verursachte Fehler insgesamt verhindert.

---

27) Was sind die Lebenszyklusschritte von React?

Wichtige Lebenszyklusschritte von React js sind:

• Initialisierung
• Status-/Eigenschaftsaktualisierungen
• Zerstörung ist der Lebenszyklus von React

---

28) Nennen Sie den Hauptunterschied zwischen Pros und State

Der Hauptunterschied zwischen den beiden besteht darin, dass der Staat veränderlich und die Vorteile unveränderlich sind.

---

29) Erklären Sie reine Komponenten in React js

Reine Komponenten sind die schnellsten Komponenten, die jede Komponente mit nur einem render() ersetzen können. Es hilft Ihnen, die Einfachheit des Codes und die Leistung der Anwendung zu verbessern.

---

30) Welche Art von Informationen steuern ein Segment in React?

Es gibt hauptsächlich zwei Arten von Informationen, die ein Segment steuern: Status und Requisiten

• Staat: Zustandsinformationen, die sich ändern werden, müssen wir nutzen.
• Requisiten: Requisiten werden vom übergeordneten Element festgelegt und gelten während der gesamten Lebensdauer eines Teils.

---

31) Was ist „Create-React-App“?

„create-react-app“ ist ein Befehlszeilentool, mit dem Sie eine einfache Reaktionsanwendung erstellen können.

---

32) Erklären Sie die Verwendung von „key“ in der Reaktionsliste

Mit Schlüsseln können Sie jedem Listenelement eine stabile Identität verleihen. Die Schlüssel sollten eindeutig sein.

---

33) Was sind Kinderstützen?

Untergeordnete Requisiten werden verwendet, um Komponenten als Eigenschaften an andere Komponenten zu übergeben. Sie können darauf zugreifen, indem Sie verwenden

{props.children}

---

34) Fehlergrenzen erklären?

Fehlergrenzen helfen Ihnen, Javascript-Fehler an einer beliebigen Stelle in den untergeordneten Komponenten zu erkennen. Sie werden am häufigsten verwendet, um den Fehler zu protokollieren und eine Fallback-Benutzeroberfläche anzuzeigen.

---

35) Wozu dienen leere Tags <> ?

Leere Tags werden in React zum Deklarieren von Fragmenten verwendet.

---

36) Erklären Sie den strikten Modus

Mit StrictMode können Sie Prüfungen und Warnungen für Reaktionskomponenten ausführen. Es läuft nur auf Entwicklungs-Builds. Es hilft Ihnen, die Probleme hervorzuheben, ohne dass eine sichtbare Benutzeroberfläche angezeigt wird.

---

37) Was sind Reaktionsportale?

Mit Portal können Sie untergeordnete Elemente in einen DOM-Knoten rendern. CreatePortal-Methode wird dafür verwendet.

---

38) Was ist Kontext?

Der Reaktionskontext hilft Ihnen, Daten mithilfe des Baums der Reaktionskomponenten zu übergeben. Es hilft Ihnen, Daten global zwischen verschiedenen Reaktionskomponenten auszutauschen.

---

39) Wozu dient Webpack?

Webpack ist im Grunde ein Modul-Builder. Es wird hauptsächlich während des Entwicklungsprozesses ausgeführt.

---

40) Was ist Babel in React js?

Babel ist ein JavaScript-Compiler, der das neueste JavaScript wie ES6, ES7 in einfaches altes ES5-JavaScript konvertiert, das die meisten Browser verstehen.

---

41) Wie kann ein Browser eine JSX-Datei lesen?

Wenn Sie möchten, dass der Browser JSX liest, sollte diese JSX-Datei mit einem JSX-Transformer wie Babel ersetzt und dann an den Browser zurückgesendet werden.

---

42) Was sind die Hauptprobleme bei der Verwendung der MVC-Architektur in React?

Hier sind die größten Herausforderungen, denen Sie beim Umgang mit der MVC-Architektur gegenüberstehen:

• Die DOM-Verwaltung ist ziemlich teuer
• Die meisten Anwendungen waren langsam und ineffizient
• Aufgrund zirkulärer Funktionen wurde ein komplexes Modell rund um Modelle und Ideen erstellt

---

43) Was kann man tun, wenn es mehr als eine Ausdruckszeile gibt?

Zu diesem Zeitpunkt ist ein mehrzeiliger JSX-Ausdruck die einzige Option, die Ihnen bleibt.

---

44) Wie hoch ist die Reduzierung?

Die Kürzung ist eine Anwendungsmethode des Umgangs mit Staat.

---

45) Erklären Sie den Begriff synthetische Ereignisse

Es handelt sich tatsächlich um einen browserübergreifenden Wrapper um das native Ereignis des Browsers. Diese Ereignisse verfügen über die Schnittstellen stopPropagation() und präventDefault().

---

46) Wann sollten Sie die Top-Class-Elemente für das Funktionselement verwenden?

Wenn Ihr Element einen Phasen- oder Lebenszyklus durchläuft, sollten wir erstklassige Elemente verwenden.

---

47) Wie können Sie ein Element beim Parsen teilen?

Mithilfe des Staates können wir die Daten teilen.

---

48) Erklären Sie den Begriff Versöhnung

Wenn sich der Status oder die Requisiten einer Komponente ändern, vergleicht rest das gerenderte Element mit dem zuvor gerenderten DOM und aktualisiert bei Bedarf das tatsächliche DOM. Dieser Vorgang wird als Versöhnung bezeichnet.

---

49) Wie können Sie eine Komponente erneut rendern, ohne die Funktion setState() zu verwenden?

Sie können die Funktion „forceUpdate()“ verwenden, um jede Komponente erneut zu rendern.

---

50) Können Sie Requisiten in React aktualisieren?

Sie können Requisiten in React JS nicht aktualisieren, da Requisiten schreibgeschützt sind. Darüber hinaus können Sie vom Elternteil zum Kind erhaltene Requisiten nicht ändern.

---

51) Erklären Sie den Begriff „Restrukturierung“.

Umstrukturierung ist Extraktionsprozess von Array Objekte. Sobald der Vorgang abgeschlossen ist, können Sie jedes Objekt in einer separaten Variablen trennen.

---

52) Können Sie die Werte von Requisiten aktualisieren?

Es ist nicht möglich, den Wert von Requisiten zu aktualisieren, da er unveränderlich ist.

---

53) Erklären Sie die Bedeutung von Montage und Demontage

• Der Vorgang des Anbringens des Elements am DCOM wird als Montage bezeichnet.
• Der Vorgang des Trennens des Elements vom DCOM wird als Demontagevorgang bezeichnet.

---

54) Wozu dient die „Prop-Types“-Bibliothek?

Mit der Bibliothek „Prop-Types“ können Sie in einer aktuellen Anwendung eine Laufzeittypprüfung für Requisiten und ähnliche Objekte durchführen.

---

55) Erklären Sie Reaktionshaken

Mit React-Hooks können Sie State und andere React-Funktionen verwenden, ohne eine Klasse schreiben zu müssen.

---

56) Was sind Fragmente?

Sie können das Schlüsselwort fragment verwenden, um eine Liste untergeordneter Komponenten zu gruppieren, ohne zusätzliche Knoten im DOM zu verwenden. Zum Beispiel :

render() {

return (
);
}

---

57) Was ist der Hauptunterschied zwischen createElement und cloneElment?

• createElement wird von React verwendet, um React-Elemente zu erstellen.
• cloneElement wird verwendet, um ein Element zu klonen und ihm neue Requisiten zu übergeben.

---

58) Was sind kontrollierte Komponenten?

Kontrollierte Komponenten sind Komponenten, die die Eingabeelemente steuern.

---

59) Warum müssen Sie props.children verwenden?

Mit dieser props.children können Sie eine Komponente als Daten an andere Komponenten übergeben.

---

60) Listen Sie einige der Methoden in einem React-Dom-Paket auf

Wichtige Methoden für React-Dom-Pakete sind:

• machen()
• Hydrat()
• createPortal()
• unmountComponentAtNode()
• findDOMNode()

---

61) Wie können wir serverseitiges Rendering in React durchführen?

Wir können Reaction Serve verwenden, um das serverseitige Rendering durchzuführen.

---

62) Nennen Sie den Unterschied zwischen getInitialState() und constructionor()?

Wenn Sie eine Komponente erstellen möchten, indem Sie „React. Component‘ hilft Ihnen der Konstruktor bei der Initialisierung des Zustands. Wenn Sie jedoch mit „Reat.createClass“ erstellen möchten. Dann sollten Sie „genInitiaState“ verwenden.

---

63) Was ist Refs?

Ref sind ein Attribut der DOM-Elemente. Der Hauptzweck der Refs besteht darin, die DOM-Elemente leicht zu finden.

---

64) Was ist ComponentWillMount()

ComponentWillMount() dient dazu, API-Aufrufe durchzuführen, sobald die Komponente initiiert wurde, und die Werte in den Status zu konfigurieren. Um einen API-Aufruf durchzuführen, verwenden Sie einen HttpClient wie Axios, oder wir können fetch() verwenden, um den AJAX-Aufruf auszulösen.

---

65) Wie werden die Daten im Geschäft versendet?

Wir können die Daten an eine andere Komponente weiterleiten, die auf der Aktion basieren sollte, die die übergeordnete Komponente speichert.

---

66) Wie können Sie mit Redux mehr Action bewältigen?

Um dieselbe Komponente in einem größeren Aktionsfluss zu erstellen, verwenden wir dieselbe Funktionalität in verschiedenen Modulen.

---

67) Wie kann man die Reduzierstücke verschütten?

Wir können die Rettungsaktionen basierend auf den Ereignissen durchführen. Diese Aktion sollte in separate Module aufgeteilt werden.

---

68) Nennen Sie fünf beliebige vordefinierte Prototypen, die in React verwendet werden

Die wichtigsten in React js verwendeten Prototypen sind:

• Anzahl
• Schnur
• Array
• Objekt
• Element

---

69) Was ist der Zweck der Verwendung von bindActionsCreators?

BindActionCreator hilft Ihnen, das Ereignis basierend auf dem Aktions-Dispatcher an das HTML-Element zu binden.

---

70) Was ist REFS in React?

Ref ist eine Referenz auf das Element. Dies sollte in den meisten Fällen vermieden werden. Manchmal wird es jedoch verwendet, wenn Sie direkt auf das DOM oder die Instanz der Komponente zugreifen müssen.

---

71) Kann das JSX-Element an andere JSX-Komponenten angehängt werden?

Ja, Sie können das Anhängen eines JSX-Elements mit anderen JSX-Komponenten verwenden, was dem Verschachteln von HTML-Elementen sehr ähnlich ist.

---

72) Was ist die aktuelle stabile Version von React?

Die aktuelle stabile Version von React ist Version 17.5

---

73) Nennen Sie ein wichtiges Merkmal der Redux-Workflow-Funktionen

Wichtige Funktionen des Redux-Workflows sind:

• Zurücksetzen: Hilft Ihnen, den Status des Stores zurückzusetzen
• Zurücksetzen: Ermöglicht das Zurücksetzen auf den zuletzt festgeschriebenen Status
• Sweep: Alle Deaktivierungsaktionen, die Sie möglicherweise versehentlich auslösen, werden entfernt
• Commit: Hilft Ihnen, den aktuellen Zustand zum Ausgangszustand zu machen.

---

74) Nennen Sie den Unterschied zwischen React JS und React Native

React JS ist eine Front-End-Open-Source-JavaScript-Bibliothek, die zum Erstellen von Benutzeroberflächen verwendet wird, während React Native ein Open-Source-Framework für Mobilgeräte ist, das es Entwicklern ermöglicht, React auf Plattformen wie Android und anderen zu verwenden iOS. Diese Interviewfragen werden Ihnen auch bei Ihrem Lebenslauf (mündlich) helfen.