Wie man ein JavaScript-Vorstellungsgespräch besteht: Fortgeschrittenes Niveau

Wie man ein JavaScript-Vorstellungsgespräch besteht: Top-Fragen für Fortgeschrittene

Ein Vorstellungsgespräch für eine Position als Senior JavaScript-Entwickler oder Node.js-Ingenieur ist nicht nur eine Überprüfung der Syntax. Interviewer möchten ein tiefes Verständnis der Sprache sehen: wie der Event Loop funktioniert, was der Kontext this wirklich bedeutet und wie man die "höllische" Verschachtelung bei der Arbeit mit Asynchronität vermeidet. In diesem Artikel analysieren wir die häufigsten und kniffligsten Fragen, die auf fortgeschrittenem Niveau gestellt werden. Machen Sie sich bereit, nicht nur Antworten zu lesen, sondern die Mechanik zu verstehen.

1. Event Loop, Aufrufstapel und Mikrotasks (Microtasks vs Macrotasks)

Dies ist wohl der beliebteste Block in Node.js-Vorstellungsgesprächen. Die Frage lautet: "Was gibt dieser Code aus und in welcher Reihenfolge?".

console.log('1');\n\nsetTimeout(() => console.log('2'), 0);\n\nPromise.resolve().then(() => console.log('3'));\n\nprocess.nextTick(() => console.log('4'));\n\nconsole.log('5');

Richtige Antwort: 1, 5, 4, 3, 2.

Analyse:

\n
• Synchroner Code (1, 5) wird zuerst ausgeführt.
\n
• process.nextTick() ist ein Mikrotask mit der höchsten Priorität. Er wird unmittelbar nach der aktuellen Operation ausgeführt, aber VOR allen anderen Mikrotasks (Promise) und Makrotasks (setTimeout).
\n
• Promise.then() ist ebenfalls ein Mikrotask, aber seine Priorität ist niedriger als die von nextTick.
\n
• setTimeout(cb, 0) ist ein Makrotask. Er wird erst ausgeführt, nachdem der Aufrufstapel und alle Mikrotasks (alle nextTick und Promise) vollständig abgearbeitet sind.
\n

Wie man richtig antwortet: Erklären Sie, dass Node.js Phasen des Event Loops hat. Mikrotasks (process.nextTick und Promise) werden zwischen den Phasen verarbeitet. Makrotasks (setTimeout, setInterval, I/O) werden innerhalb der Phasen verarbeitet. nextTick ist eine nicht standardmäßige, aber sehr wichtige Warteschlange, die den Event Loop blockieren kann, wenn sie rekursiv verwendet wird.

2. Der Kontext this und sein "Verlust"

Frage: "Wie funktioniert this in JavaScript? Geben Sie ein Beispiel, wo this verloren geht, und wie man das behebt".

Das fortgeschrittene Niveau setzt voraus, dass Sie die 4 Regeln kennen:

\n
1. Neue Bindung (new binding) — beim Aufruf einer Funktion mit new zeigt this auf das neu erstellte Objekt.
\n
2. Explizite Bindung — call, apply, bind.
\n
3. Implizite Bindung — wenn eine Funktion als Methode eines Objekts aufgerufen wird (obj.method()).
\n
4. Standardmäßig — das globale Objekt (global in Node.js, window im Browser) oder undefined im strikten Modus.
\n

Beispiel für Kontextverlust:

const user = {\n  name: 'Alice',\n  greet() {\n    console.log(`Hallo, ${this.name}`);\n  }\n};\n\nconst greetFn = user.greet;\ngreetFn(); // Hallo, undefined

Warum? Wir haben die Methode einer Variablen zugewiesen. Jetzt wird greetFn() ohne den Kontext des Objekts (user) aufgerufen. this wird an das globale Objekt gebunden (oder undefined im strict mode).

Wie man es behebt:

\n
• bind verwenden: const greetFn = user.greet.bind(user);
\n
• Eine Pfeilfunktion verwenden (sie hat kein eigenes this, sondern nimmt es aus der äußeren lexikalischen Umgebung).
\n
• Über call/apply aufrufen: greetFn.call(user).
\n

Bonusfrage: "Was passiert, wenn user.greet an setTimeout übergeben wird?" — Derselbe Effekt des Kontextverlusts. Behebung durch bind oder eine Pfeilfunktion im Callback.

3. Closures