Heim > Web-Frontend > js-Tutorial > Javascript-Heben

Javascript-Heben

Susan Sarandon
Freigeben: 2025-01-12 16:44:42
Original
836 Leute haben es durchsucht

Javascript Hoisting

In JavaScript können Sie eine Variable verwenden, bevor Sie sie deklarieren. Dies nennt man „Heben“. Die Deklaration wird nach oben verschoben, sodass die Variable auch dann erkannt wird, wenn sie früher verwendet wurde.

In JavaScript gibt es zwei Arten des Hebens:

  1. Funktionsanhebung: Mit dem Funktionsschlüsselwort deklarierte Funktionen werden an den oberen Rand ihres Gültigkeitsbereichs „angehoben“, sodass sie aufgerufen werden können, bevor sie definiert werden.
  2. Variablen-Anhebung: Mit var deklarierte Variablen werden ebenfalls an den oberen Rand ihres Gültigkeitsbereichs „angehoben“, aber nur die Deklaration wird angehoben, nicht die Zuweisung.

HINWEIS:

  • let- und const-Variablen werden nicht auf die gleiche Weise angehoben wie var-Variablen. Sie werden immer noch angehoben, aber erst initialisiert, wenn sie deklariert werden. Daher führt der Versuch, vor ihrer Deklaration auf sie zuzugreifen, zu einem ReferenceError.

  • Das Hochziehen von Funktionen in JavaScript funktioniert nur für:
    Funktionsdeklarationen: Funktionen, die mit dem Funktionsschlüsselwort deklariert werden, etwa so: function myFunction() { ... }
    Es funktioniert nicht für:
    Funktionsausdrücke: Funktionen, die einer Variablen zugewiesen sind, wie folgt: var myFunction = function() { ... }
    Pfeilfunktionen: Funktionen, die mit der Pfeilsyntax deklariert werden, etwa so: var myFunction = () => { ... }
    Daher werden in JavaScript nur einfache Funktionsdeklarationen angehoben.

Beispiel für einen variablen Hebevorgang:

// Using the variable before declaring it
console.log(x);  // Output: undefined

// Declaring the variable
var x = 10;
Nach dem Login kopieren
Nach dem Login kopieren

In diesem Beispiel gibt der Code keinen Fehler aus, auch wenn x vor der Deklaration verwendet wird. Stattdessen wird x als undefiniert protokolliert. Dies liegt daran, dass die Variablendeklaration nach oben gehoben wird.

Funktionshebebeispiel:

// Calling the function before it's declared
myFunction();

// Declaring the function
function myFunction() {
console.log("Hello, world!");
}

// Output: "Hello, world!"
Nach dem Login kopieren
Nach dem Login kopieren

In diesem Beispiel funktioniert der Code immer noch, obwohl wir myFunction() aufrufen, bevor es deklariert wird, da die Funktionsdeklaration an die Spitze des Gültigkeitsbereichs „angehoben“ wird.

Dann sagen Sie mir: „Könnte einen kurzen Abschnitt zu „Best Practices“ hinzufügen“ dafür

Best Practices für den Umgang mit Hebevorgängen in JavaScript

  1. Variablen oben deklarieren
  2. Deklarieren Sie Variablen immer am Anfang ihres Gültigkeitsbereichs
  3. Verbessert die Lesbarkeit des Codes
  4. Verhindert unerwartetes Verhalten beim Heben
// Using the variable before declaring it
console.log(x);  // Output: undefined

// Declaring the variable
var x = 10;
Nach dem Login kopieren
Nach dem Login kopieren
  1. Bevorzugen Sie let und const gegenüber var
  2. Verwenden Sie let und const für ein vorhersehbareres Variablenverhalten
  3. Sie haben einen Blockbereich und werden nicht auf die gleiche Weise wie Var angehoben
  4. Hilft, unbeabsichtigten Variablenzugriff zu verhindern
// Calling the function before it's declared
myFunction();

// Declaring the function
function myFunction() {
console.log("Hello, world!");
}

// Output: "Hello, world!"
Nach dem Login kopieren
Nach dem Login kopieren
  1. Verlassen Sie sich nicht auf das Heben
  2. Schreiben Sie keinen Code, der von der Hebemechanik abhängt
  3. Deklarieren Sie Funktionen und Variablen, bevor Sie sie verwenden
  4. Macht Ihren Code expliziter und verständlicher
function example() {
    // Recommended approach
    let x, y, z;

    // Rest of your code
}
Nach dem Login kopieren
  1. Strikten Modus verwenden
  2. Aktivieren Sie „Strikt verwenden“, um potenzielle Hebefehler zu erkennen
  3. Hilft, problematische Codemuster zu identifizieren und zu verhindern
// Recommended
let count = 10;
const MAX_SIZE = 100;

// Avoid
var unpredictableVariable;
Nach dem Login kopieren
  1. Seien Sie konsistent mit Funktionsdeklarationen
  2. Halten Sie sich für eine bessere Vorhersagbarkeit an Funktionsdeklarationen
  3. Vermeiden Sie die Vermischung von Funktionsdeklarationen und Ausdrucksstilen
// Good: Clear and predictable
function calculateTotal() {
    // Function logic
}

calculateTotal();

// Avoid: Relies on hoisting
calculateTotal(); // Risky

function calculateTotal() {
    // Function logic
}
Nach dem Login kopieren

Profi-Tipps

  • Streben Sie immer nach Codeklarheit
  • Verstehen Sie das Heben, aber verlassen Sie sich nicht darauf als Kodierungstechnik
  • Schreiben Sie Code, der selbsterklärend und vorhersehbar ist

Das obige ist der detaillierte Inhalt vonJavascript-Heben. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage