Čtenáři jako vy pomáhají podporovat MUO. Když provedete nákup pomocí odkazů na našich stránkách, můžeme získat provizi přidružené společnosti.

Hoisting je mechanismus JavaScriptu, který vám umožňuje přistupovat k proměnným a funkcím před jejich inicializací. Zvednutí takové deklarace ji efektivně posune na vrchol své působnosti.

Zjistěte vše o tom, jak zvedání funguje v JavaScriptu a jak jej nejlépe spravovat, abyste se vyhnuli chybám v kódu.

Zvedací proměnné S var, let a const

Zvednutí je možné, protože JavaScript používá kompilační systém JIT (Just-in-Time), který skenuje váš kód, aby identifikoval všechny proměnné v jejich příslušných oborech.

Kompilátor JIT pak při kompilaci zvedne všechny instance deklarací proměnných na vrchol jejich rozsahu. JavaScript shromažďuje pouze deklarace proměnných, nikoli jejich inicializace.

Chování proměnných při zvednutí závisí na klíčovém slově, kterým je deklarujete, protože každé klíčové slovo se chová jinak.

var

Přístup k neinicializované proměnné deklarované pomocí var klíčové slovo se vrátí nedefinováno. Například:

instagram viewer 
řídicí panel.log (foo); // nedefinováno
var foo = 2;

Výše uvedené protokoly kódu nedefinováno protože volá konzole.log než inicializuje proměnnou.

Kompilátor JavaScriptu zobrazí předchozí blok kódu takto:

var foo;
řídicí panel.log (foo); // nedefinováno
foo = 2;

Během zvedání se proměnné podřizují pravidla určování rozsahu JavaScriptu. Javascript zvedne proměnnou pouze na vrchol rozsahu, ve kterém jste ji deklarovali. Pokus o protokolování hodnoty proměnné mimo její deklarovaný rozsah bude mít za následek a ReferenceError. Pokud například deklarujete proměnnou uvnitř funkce, nebude viditelná mimo tento rozsah:

funkcemyFunction() {
řídicí panel.log (foo); // nedefinováno
var foo = 10;
}
myFunction();
řídicí panel.log (foo); // ReferenceError: foo není definováno

Pokus o přístup k proměnné mimo její rozsah bude mít za následek a ReferenceError.

nechat a konst

Podle MDN dokumentace na nechat a konst zvedání, JavaScript také shromažďuje proměnné deklarované pomocí nechat a konst klíčová slova. Nicméně na rozdíl od proměnných deklarovaných pomocí var klíčové slovo, nejsou inicializovány s nedefinováno hodnota.

Například:

funkcemyFunction() {
řídicí panel.log (foo); // nedefinováno
řídicí panel.log (bar); // ReferenceError: Nelze získat přístup k 'baru' před inicializací
řídicí panel.log (baz); // ReferenceError: Nelze získat přístup k 'baz' před inicializací
var foo = 5;
nechat bar = 10;
konst baz = 15;
}
myFunction();

K proměnným deklarovaným pomocí klíčových slov let a const nemůžete přistupovat, dokud je neinicializujete s hodnotou.

Zvedací funkce

JavaScript výtahy fungují podobně jako proměnné. Stejně jako u proměnných záleží na tom, jak je deklarujete. JavaScript například shromažďuje deklarace funkcí jinak než výrazy funkcí.

Deklarace funkce je funkce deklarovaná jménem, ​​zatímco výraz funkce je funkce, jejíž název můžete vynechat. Například:

funkcefoo() {
// deklarace funkce
}
konst pruh = () => {
// výraz funkce
}

JavaScript zvedne deklarace funkcí, ale ne výrazy funkcí. Například:

foo(); // 5
bar(); // TypeError: bar() není funkce
// Deklarace funkce
funkcefoo() {
řídicí panel.log(5);
}
// Výraz funkce
var bar = funkcevýraz() {
řídicí panel.log(10);
};

Tento kód volá foo před deklarací a inicializací jako funkce, ale stále se zaznamenává 5 do konzole. Nicméně pokus dovolat bar vede k a TypeError.

Řízení zdvihání

Uvědomění si zvedání a potenciálních chyb, které by mohly nastat, pokud by byly spravovány nesprávně, vám může ušetřit dlouhé hodiny ladění. Zde je několik způsobů, jak můžete spravovat zdvihání.

Deklarace proměnných uvnitř funkcí

Deklarujte proměnné uvnitř funkcí, které k nim budou přistupovat. Ne vždy to budete moci udělat, protože možná budete potřebovat globální proměnnou, ke které budete mít přístup v rámci více funkcí. Ujistěte se tedy, že proměnné deklarujete globálně pouze v případě, že to opravdu potřebujete.

Deklarujte proměnné s let nebo const

Vždy byste měli používat let a const klíčová slova místo var klíčové slovo při deklaraci proměnných. Tato praxe je výhodná při deklarování lokálních proměnných uvnitř funkce. Znát správné způsoby deklarovat proměnné v JavaScriptu snižuje pravděpodobnost chyb způsobených zvedáním, které se vyskytují ve vašem kódu.

Deklarujte proměnné na vrcholu jejich rozsahu

Deklarujte všechny své proměnné v horní části jejich příslušných oborů před jakýmikoli jinými příkazy. Tím zajistíte, že kompilátor JavaScriptu nebude muset tyto proměnné zvedat, aby k nim měl přístup.

Použití přísného režimu

Přísný režim je režim JavaScriptu který reguluje špatnou syntaxi, optimalizuje dobu běhu vašeho kódu a zakazuje zneužití volně napsané syntaxe JavaScriptu vyvoláním chyb při kompilaci.

Například v „nedbalém režimu“ kvůli zvedání můžete přistupovat k proměnné mimo inicializovanou funkci, i když nebyla deklarována:

myFunction();
řídicí panel.log (foo); // 20
funkcemyFunction() {
 foo = 20; 
}

V bloku kódu výše JavaScript automaticky deklaruje foo a zvedne jej na vrchol globálního rozsahu, přičemž ignoruje rozsah, ve kterém jste jej inicializovali.

K opravě tohoto chování můžete použít přísný režim a při pokusu o přístup k proměnné mimo její rozsah funkce vyvoláte chybu.

Přísný režim nepřestává zvedání úplně. Místo toho zabraňuje nejvíce matoucím a chybám náchylným formám zvedání. Stále je důležité porozumět obecné koncepci a pravidlům zvedání, i když používáte bezpečnostní síť v přísném režimu.

Chcete-li se přihlásit do přísného režimu na globální úrovni, deklarujte syntaxi v horní části souboru skriptu:

"použitípřísný"; // nebo 'použitípřísný'

Chcete-li se přihlásit do přísného režimu na úrovni funkce, deklarujte syntaxi v horní části těla funkce před jakýmkoli příkazem:

funkcemyStrictFunction() {
 "použitípřísný";
}

Pokud deklarujete přísný režim na úrovni funkce, nastavení se použije pouze na příkazy uvnitř této funkce.

Deklarování přísného režimu na globální úrovni zabrání přístupu k proměnným mimo jejich příslušné rozsahy:

"použitípřísný";
myFunction();
řídicí panel.log (foo); // ReferenceError: foo není definováno
funkcemyFunction() {
 foo = 20; 
}

Se zapnutým přísným režimem se kompilátor JavaScriptu zvedne myFunction() na vrchol svého rozsahu bez nedeklarované proměnné.

Pochopte, co ovlivňuje zdvihání

Zdvihání je pro JavaScript zcela unikátní a může být velmi matoucím chováním, které vám zamotá hlavu. Může ovlivnit proměnné a funkce, ale existují způsoby, jak tomu v případě potřeby zabránit.

Několik faktorů může ovlivnit zvedání, takže je nejlepší se vyhnout jakémukoli výskytu proměnné nebo funkce zvedání ve vašem kódu.