Warum führt das Aliasing von JavaScript-Funktionen in einigen Browsern zu Fehlern, in anderen jedoch nicht?

Aliasing von JavaScript-Funktionen: Ein unerwartetes Hindernis

Frage:

Trotz Versuchen, sowohl die Alias- als auch die Function-Wrapper-Methode zu verwenden, schlägt das Aliasing von document.getElementById fehl in Firefox, Chrome und sogar den Debug-Fenstern. In Firefox wird ein Fehler ausgegeben, während in Chrome ein „illegaler Aufruf“ auftritt. Darüber hinaus funktioniert der Vorgang in Internet Explorer 8.

Untersuchung:

Nach einer eingehenden Analyse liegt das Problem in der Art und Weise, wie JavaScript-Funktionen lose an Objekte angehängt sind und mit dem Gültigkeitsbereich interagieren.

Erklärung:

Beim Aufruf einer JavaScript-Funktion weist der Interpreter einen Bereich zu und übergibt ihn an die Funktion. Wenn eine Funktion dies verwendet, um auf den Bereich zu verweisen, ist der Wert von this der übergebene Bereich.

Sie können den Bereich jedoch manuell mit der Apply-Methode angeben und dabei den von der zugewiesenen Standardbereich überschreiben Interpreter.

Das Aliasing-Problem:

Beim Aliasing von document.getElementById als $ tritt ein Fehler auf, da beim Aufruf von $('someElement') der Bereich auf das Fensterobjekt und nicht auf das Dokument festgelegt wird Objekt. Wenn die Implementierung von getElementById daher erwartet, dass der Bereich das Dokument ist, schlägt die Funktion fehl.

Fix:

Um dieses Problem zu beheben, können Sie $.apply(document, [' someElement']), um den Bereich explizit auf das Dokumentobjekt festzulegen.

Warum es in Internet Explorer funktioniert:

Der unerwartete Erfolg von Aliasing in Internet Explorer kann auf die Tatsache zurückgeführt werden, dass im IE , das Fensterobjekt entspricht dem Dokumentobjekt. Wenn das der Fall ist, sollte Aliasing im IE ordnungsgemäß funktionieren.

Umfassendes Beispiel:

Um das Problem weiter zu veranschaulichen, betrachten Sie die folgende Personenfunktion:

function Person(birthDate) {
  this.birthDate = birthDate;
  this.getAge = function() { return new Date().getFullYear() - this.birthDate.getFullYear(); };
  this.getAgeSmarter = function() { return this.getAge(); };
  this.getAgeSmartest = function() { return (this.constructor == Person ? this : self).getAge(); };
}

Mit zwei Instanzen der Person-Klasse erstellt, yogi und anotherYogi, hier sind die entsprechenden Ausgaben:

• console.log(yogi.getAge()): 100 (richtig)
• console. log(ageAlias()): -1 (falscher Bereich)
• console.log(ageAlias.apply(yogi)): 100 (richtiger Bereich)
• console.log(ageSmarterAlias()) : 100 (richtiger Bereich)
• console.log(ageSmarterAlias.apply(anotherYogi)): 100 (falscher Bereich)
• console.log(ageSmartestAlias()): 100 (richtiger Bereich)
• console.log(ageSmartestAlias.apply(document)): 100 (korrekter Bereich)
• console.log(ageSmartestAlias.apply(anotherYogi)): 200 (korrekter Bereich)

Das Beispiel zeigt die Komplexität des Umfangs und die Bedeutung der Verwendung der Apply-Methode beim Aliasing von Funktionen.

Das obige ist der detaillierte Inhalt vonWarum führt das Aliasing von JavaScript-Funktionen in einigen Browsern zu Fehlern, in anderen jedoch nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!