7 Interviewfragen zu JS, wie viele können Sie richtig beantworten

Vorwort

In JavaScript ist dies der Kontext zum Aufrufen der Funktion. Gerade weil dieses Verhalten sehr komplex ist, werden in JavaScript-Interviews immer wieder Fragen hierzu gestellt.

Die beste Vorbereitung auf ein Vorstellungsgespräch ist das Üben. Deshalb hat dieser Artikel 7 interessante Vorstellungsgespräche zu diesem Stichwort zusammengestellt.

Hinweis: Der folgende JavaScript-Code wird im nicht strikten Modus ausgeführt.

1: Variablen und Eigenschaften

Was gibt der folgende Code aus:

const Objekt = {
 Nachricht: 'Hallo Welt!',

 getMessage() {
 const message = „Hallo, Erde!“;
 gib diese Nachricht zurück;
 }
};

konsole.log(Objekt.getMessage()); // => ?

Antwort:

Ausgabe: „Hallo Welt!“

object.getMessage() ist ein Methodenaufruf, deshalb ist dies innerhalb der Methode gleich dem Objekt.

Es gibt in der Methode auch eine Variablendeklaration const message = ‚Hallo Erde!‘, die den Wert dieser Nachricht nicht beeinflusst.

2: Name der Katze

Was gibt der folgende Code aus:

Funktion Haustier(Name) {
 dieser.name = Name;

 dies.getName = () => dies.name;
}

const cat = neues Haustier('Flauschig');

konsole.log(cat.getName()); // => ?

const { getName } = Katze;
konsole.log(getName()); // =>?

Antwort:

Ausgabe: ‚Fluffy‘ und ‚Fluffy‘

Wenn eine Funktion als Konstruktor aufgerufen wird ( new Pet('Fluffy') ), ist dies innerhalb des Konstruktors gleich dem konstruierten Objekt.

Der Ausdruck this.name = name im Pet-Konstruktor erstellt die Namenseigenschaft für das erstellte Objekt.

this.getName = () => this.name this.getName = () => this.name Erstellt die Methode getName für das erstellte Objekt. Da eine Pfeilfunktion verwendet wird, ist dies in der Pfeilfunktion gleich diesem im äußeren Bereich, bei dem es sich um den Konstruktor Pet handelt.

Der Aufruf von cat.getName() und getName() gibt den Ausdruck this.name zurück, der als „Fluffy“ ausgewertet wird.

3: Verzögerte Ausgabe

Was gibt der folgende Code aus:

const Objekt = {
 Nachricht: 'Hallo Welt!',

 logMessage() {
 console.log(diese.Nachricht); // => ?
 }
};

setTimeout(Objekt.logMessage, 1000);

Antwort:

Nach einer Verzögerung von 1 Sekunde wird ausgegeben: undefiniert

Obwohl die Funktion setTimeout() object.logMessage als Rückruf verwendet, ruft sie object.logMessage dennoch als reguläre Funktion und nicht als Methode auf. Und bei einem regulären Funktionsaufruf ist dies gleich dem globalen Objekt, das ein Fenster in einer Browserumgebung ist. Aus diesem Grund gibt console.log(this.message) innerhalb der Methode logMessage das nicht definierte window.message aus.

Herausforderung: Wie können Sie diesen Code ändern, um „Hallo Welt!“ auszugeben? Schreiben Sie Ihre Lösung in die Kommentare unten*

4: Vervollständigen Sie den Code

Vervollständigen Sie den Code, sodass die Ausgabe „Hallo Welt!“ lautet.

const Objekt = {
 Nachricht: „Hallo Welt!“
};

Funktion logMessage() {
 console.log(this.message); // => "Hallo Welt!"
}

// Schreiben Sie Ihren Code hier ...

Antwort:

Es gibt mindestens drei Möglichkeiten, logMessage() als Methode für ein Objekt aufzurufen. Jede der folgenden Antworten wird als richtig angesehen:

const Objekt = {
 Nachricht: „Hallo Welt!“
};

Funktion logMessage() {
 console.log(this.message); // => 'Hallo Welt!'
}

// Verwenden der Methode func.call() logMessage.call(object);

// Verwenden der Methode func.apply() logMessage.apply(object);

//Funktionsbindung verwenden const boundLogMessage = logMessage.bind(object);
gebundeneLogMessage();

5. Begrüßungen und Verabschiedungen

Was gibt der folgende Code aus:

const Objekt = {
 wer: 'Welt',

 grüßen() {
 returniere `Hallo, ${this.who}!`;
 },

 Abschied: () => {
 returniere `Auf Wiedersehen, ${this.who}!`;
 }
};

konsole.log(Objekt.greet()); // => ?
console.log(Objekt.Abschied()); // => ?

Antwort:

Ausgabe: „Hallo Welt!“ und „Auf Wiedersehen, undefined!“

Wenn object.greet() aufgerufen wird, ist der Wert innerhalb der Methode greet() gleich dem Objekt, da greet eine reguläre Funktion ist. Daher gibt object.greet() „Hallo Welt!“ zurück. '.

Da es sich bei farewell() jedoch um eine Pfeilfunktion handelt, ist der Wert von this in einer Pfeilfunktion immer gleich dem this des äußeren Bereichs. Der äußere Gültigkeitsbereich von farewell() ist der globale Gültigkeitsbereich, wobei dies das globale Objekt ist. Daher gibt object.farewell() tatsächlich „Auf Wiedersehen, ${window.who}!“ zurück, was als „Auf Wiedersehen, undefined!“ ausgewertet wird.

6: Knifflige Länge

Was gibt der folgende Code aus:

Varlänge = 4;
Funktion Rückruf() {
 console.log(diese.Länge); // => ?
}

const Objekt = {
 Länge: 5,
 Methode(Rückruf) {
 Rückruf();
 }
};

Objekt.Methode(Rückruf, 1, 2);

Antwort:

Ausgabe: 4

Rufen Sie callback() mithilfe eines regulären Funktionsaufrufs innerhalb von method() auf. Da der Wert von this während eines regulären Funktionsaufrufs dem globalen Objekt entspricht, ist this.length innerhalb der callback()-Funktion window.length.

Die erste Anweisung var length = 4 auf der äußersten Ebene erstellt die Eigenschaftslänge für das globale Objekt, sodass window.length 4 wird.

Schließlich ist innerhalb der Funktion callback() der Wert von this.length window.length, was 4 ausgibt.

7: Aufrufparameter

Was gibt der folgende Code aus:

Varlänge = 4;
Funktion Rückruf() {
 console.log(this.length); // Ausgabe }

const Objekt = {
 Länge: 5,
 Methode() {
 Argumente[0]();
 }
};

Objekt.Methode(Rückruf, 1, 2);

Antwort:

Ausgabe: 3

obj.method(callback, 1, 2) wird mit 3 Argumenten aufgerufen: callback, 1 und 2. Die spezielle Variable „arguments“ innerhalb der resultierenden Methode () ist ein arrayähnliches Objekt mit der folgenden Struktur:

{
 0: Rückruf,
 1: 1, 
 zweiundzwanzig, 
 Länge: 3 
}

Da arguments[0]() ein Methodenaufruf beim Rückruf des Argumentobjekts ist, ist dieser interne Rückruf gleichbedeutend mit Argumenten. Als Ergebnis sind this.length und arguments.length innerhalb von callback() gleich, beide sind 3.

Zusammenfassen

Wenn Sie mehr als 5 richtig haben, haben Sie dieses Schlüsselwort ziemlich gut gemeistert.

Damit ist dieser Artikel über 7 JS-Interviewfragen abgeschlossen. Weitere relevante JS-Interviewfragen finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, Sie werden 123WORDPRESS.COM auch in Zukunft unterstützen!