Nimm useRef, wenn du einen veränderbaren Wert brauchst, der Renders überlebt, aber keinen auslösen darf: eine DOM-Node, eine Timer-ID, den vorherigen Wert einer Prop, ein Flag, das festhält, ob etwas schon gelaufen ist. Nimm useState, wenn der Wert in der UI auftauchen soll, denn in eine Ref zu schreiben plant keinen Render ein. Die Faustregel ist simpel: Soll sich der Bildschirm ändern, ist es State.
Warum Interviewer das fragen
Das ist ein schneller Test, ob du den Render-Zyklus verstehst. Der Interviewer will zuerst den Unterschied beim Auslösen von Renders hören und danach die richtigen Instinkte, wann eine Ref das passende Werkzeug ist. Oft kommt eine Nachfrage zum Lesen oder Schreiben von Refs während des Renders, und genau da fallen Leute um, die Refs nur für DOM-Nodes nutzen, und genau da zählt die Unterscheidung zwischen veränderbar und gerendert.
So baust du deine Antwort auf
- Fang mit dem entscheidenden Unterschied an: Refs lösen keine Renders aus.
- Zähl die drei oder vier legitimen Einsätze einer Ref auf.
- Gib die Faustregel für die Entscheidung.
- Erwähn, dass Refs während des Renders weder gelesen noch geschrieben werden sollten.
Beispielantwort
Die Trennlinie ist, ob eine Wertänderung den Bildschirm neu zeichnen soll. State tut das, eine Ref nicht. In eine Ref kommt bei mir also alles, was Buchhaltung ist und nicht UI: die DOM-Node, die ich fokussieren oder messen muss, eine Interval-ID, die ich beim Unmount löschen muss, der letzte Wert einer Prop zum Vergleichen, ein Flag im Sinne von habe ich das schon gemacht. Der klassische Fehler ist, etwas in eine Ref zu legen und sich zu wundern, warum die UI nie aktualisiert, und das Spiegelbild ist, eine Scroll-Position in State zu legen und bei jedem Scroll-Event neu zu rendern. Ich halte mich außerdem an die Regel, Refs nicht während des Renders zu lesen oder zu schreiben, sondern nur in Effects und Event-Handlern, denn während des Renders erwartet React eine reine Funktion, und ein Ref-Lesezugriff kann über mehrere Durchgänge unterschiedliche Werte liefern. Eine schöne Änderung in React 19 ist, dass ref bei Funktionskomponenten jetzt einfach eine normale Prop ist, ich habe also aufgehört, Dinge in forwardRef zu wickeln.
Steht dieses Vorstellungsgespräch bald an? GhostPilot hört bei deinem Live-Call mit, erkennt die Frage in dem Moment, in dem sie gestellt wird, und bringt dir eine strukturierte Antwort in Echtzeit auf den Bildschirm. Probier es im nächsten Mock aus, oder hol dir einen $29 Session Pass, kein Abo, für den Ernstfall.
So funktioniert esNachfragen, mit denen du rechnen solltest
- Wie kommst du an den vorherigen Wert einer Prop?
- Warum solltest du eine Ref während des Renders weder lesen noch schreiben?
- Wie hängst du in React 19 eine Ref an eine Child-Komponente?
Weitere Fragen für React-Entwickler
Dein Interviewer stellt seine eigene Version davon. Kopier deine echte Stellenbeschreibung in den kostenlosen Question Predictor und bekomm die 20 Fragen, die diese Rolle am wahrscheinlichsten stellt, samt dem, worauf jede wirklich abzielt.
Meine Fragen vorhersagen