Hoisting w JavaScript

Przenoszenie (Hoisting) to domyślne zachowanie JavaScriptu, który przenosi deklaracje na górę.

Deklaracje w JavaScriptie są przenoszone na górę

W JavaScript można deklarować zmienne po ich użyciu.

Innymi słowy, można go używać przed jego deklaracją.

Przykład 1 ZPrzykład 2 Rozwiązania są takie same:

Przykład 1

x = 5; // Przypisz 5 do x
elem = document.getElementById("demo"); // Znajdź element
elem.innerHTML = x;                     // Wyświetl x w elemencie
var x; // Deklaracja x

Spróbuj sam!

Przykład 2

var x; // Deklaracja x
x = 5; // Przypisz 5 do x
elem = document.getElementById("demo"); // Znajdź element
elem.innerHTML = x;                     // Wyświetl x w elemencie

Spróbuj sam!

Aby zrozumieć to, musisz zrozumieć termin "hoisting".

Hoisting to domyślne zachowanie JavaScriptu, który przenosi wszystkie deklaracje na górę bieżącego obszaru działania (do góry bieżącego skryptu lub bieżącej funkcji).

kluczowych słów let i const

używaj let lub const Zmienne deklarowane i stałe nie są przenoszone na górę!

Proszę, odwiedź JS Let / Const Przeczytaj więcej o let i const w.

Inicjalizacje w JavaScriptie nie są przenoszone na górę

JavaScript przenosi na górę tylko deklaracje, a nie inicjalizacje.

Przykład 1 ZPrzykład 2 Rozwiązania są różne:

Przykład 1

var x = 5; // Inicjalizuj x
var y = 7; // Inicjalizacja y
elem = document.getElementById("demo"); // Znajdź element
elem.innerHTML = x + " " + y;           // Wyświetl x i y

Spróbuj sam!

Przykład 2

var x = 5; // Inicjalizuj x
elem = document.getElementById("demo"); // Znajdź element
elem.innerHTML = x + " " + y;           // Wyświetl x i y
var y = 7; // Inicjalizacja y

Spróbuj sam!

Czy to ma sens, że w ostatnim przykładzie y jest nadal niezdefiniowane?

To jest dlatego, że tylko deklaracja (var y) a nie inicjalizacja (=7) jest przenoszona na górę.

Dzięki hoisting, y została zadeklarowana przed jej użyciem, ale ponieważ inicjalizacja nie została podniesiona, wartość y jest nadal niezdefiniowana.

Przykład 2 jest podobny:

Przykład

var x = 5; // Inicjalizuj x
var y;     // Deklaruj y
elem = document.getElementById("demo"); // Znajdź element
elem.innerHTML = x + " " + y;           // Wyświetl x i y
y = 7;    // Przypisz 7 do y

Spróbuj sam!

Deklaruj swoje zmienne na górze!

Hoisting (dla wielu deweloperów) jest nieznany lub zaniedbywany zachowanie JavaScript.

Jeśli deweloper nie rozumie hoisting, program może zawierać błędy (błędy).

Aby uniknąć błędów, zawsze deklaruj wszystkie zmienne na początku każdego zasięgu.

Ponieważ to jest sposób, w jaki JavaScript interpretuje kod, zachowuj tę dobrą nawyk.

Tryb strict JavaScript nie pozwala na użycie zmiennych niezadeklarowanych.

Naucz się tego w następnym rozdziale:use strict。”