Video-tutorial: Učení JavaScriptu a jQuery

Globální a lokální proměnné v JavaScriptu

Všechna videa tutoriálu Video-Tutorial: Učení JavaScriptu a jQuery

Proměnné v JavaScriptu jsou zásadní pro ukládání a zpracování dat. Je důležité chápat, kde jsou tyto proměnné platné a na které oblasti vašeho kódu mohou mít přístup. S ohledem na různé typy proměnných – globální a lokální – je pochopení „Scopes“ (oblast viditelnosti) základním kamenem. Pojďme se tedy ponořit a zjistit, co obnáší globální a lokální proměnné.

Nejdůležitější zjištění

  • Globální proměnné jsou dostupné kdekoli v kódu, zatímco lokální proměnné jsou viditelné pouze uvnitř své funkce.
  • Definování proměnné mimo funkci ji dělá globální, zatímco definování uvnitř funkce ji činí lokální.
  • Pro jasnou a udržovatelnou strukturu kódu je výhodné deklarovat globální proměnné na začátku skriptu.

Pokyny krok za krokem

Definice proměnných a jejich viditelnost

V prvním kroku se podíváme na to, jak můžete vytvořit proměnnou a co znamená její viditelnost. Pokud deklarujete proměnnou mimo jakoukoli funkci, jak je uvedeno v následujícím příkladu, je tato proměnná globální.

Globální a lokální proměnné v JavaScriptu

Zde vytváříme globální proměnnou nazvanou mojeProměnná.

Tvorba funkcí s lokálními proměnnými

Dalším krokem je vytvoření dvou funkcí. Jednu funkci nazveme lokálníFunkce, ve které vytvoříme lokální proměnnou. Tato proměnná je viditelná pouze uvnitř funkce. Pojďme definovat naši funkci.

V lokálníFunkce vytvoříte lokální proměnnou lokálníV s hodnotou 5 a vypíšete ji.

Volání funkcí

Teď chceme zavolat lokálníFunkce, abychom vypsali číslo 5. Po vyvolání funkce v kódu bude výstup vypadat takto:

Testování viditelnosti lokální proměnné

Teď se pokusíme použít lokální proměnnou lokálníV v jiné funkci. Zjistíte, že to nefunguje. Pojďme provést volání jinéFunkce a uvidíme, co se stane.

Dostaneme chybu, protože proměnná lokálníV je viditelná pouze uvnitř lokálníFunkce.

Kontrola chyb v konzoli

Abychom lépe pochopili, proč chyba nastává, prozkoumáme kód v konzoli. Pravým tlačítkem můžete otevřít DOM prohlížeč a konzoli pro analýzu chyby.

Globální a lokální proměnné v JavaScriptu

Tam bude uvedeno, že lokálníV je undefined. To posiluje předpoklad, že proměnná mimo svou funkci neexistuje.

Definice globální proměnné

Pojďme nyní vytvořit globální proměnnou, kterou můžeme použít v obou funkcích. Tuto proměnnou nazveme globálníProměnná a přiřadíme jí jednoduchou textovou hodnotu.

Globální a lokální proměnné v JavaScriptu

Tato globální proměnná může nyní být volána v obou funkcích a výstup bude stejný. Otestujme to.

Globální a lokální proměnné v JavaScriptu

Definice proměnných a pořadí volání

Je důležité poznamenat, že pořadí definic proměnných a funkcí je rozhodující. Pokud vytvoříte globální proměnnou pod jejím použitím, dojde k problému s undefined.

To je způsobeno tím, že funkce, která potřebuje globální proměnnou, ji vyvolává před jejím definováním. Abyste tomu předešli, je doporučeno definovat globální proměnné na vrcholu kódu.

Více o lokálních proměnných a jejich použití

Teď znovu vytvoříme lokální proměnnou v jiné funkci. Zde ji nazveme lokálníProměnná a nastavíme její hodnotu na 12.

Také tuto lokální proměnnou můžeme používat, ale pouze uvnitř její vlastní funkce, ne v jiných. Pokud použijete obě lokální proměnné, může to vyžadovat trpělivost a pořádek ve vašich programech, v závislosti na složitosti.

Souhrn konceptů

Nyní jste porozuměli základním konceptům o viditelnosti a dosahu proměnných v JavaScriptu. Globální proměnné jsou viditelné pro všechny funkce, zatímco lokální proměnné existují pouze uvnitř své funkce. Je doporučeno definovat globální proměnné na centrálním místě v kódu pro zlepšení čitelnosti a údržby.

Souhrn – Viditelnost proměnných v JavaScriptu

V souhrnu jste se naučili, že způsob, jakým definujete proměnné, má přímý vliv na jejich viditelnost a dosah. Vždy dbejte na to, kam umisťujete své proměnné, abyste se vyhnuli chybám.

Často kladené otázky

Co jsou globální proměnné?Globální proměnné jsou proměnné, které jsou deklarovány mimo funkce a jsou tedy dostupné v celém skriptu.

Co jsou lokální proměnné?Lokální proměnné jsou proměnné, které jsou vytvářeny uvnitř funkce a jsou viditelné pouze uvnitř této funkce.

Jak nejlépe využít globální proměnné?Je doporučeno definovat globální proměnné na začátku skriptu, aby byla zajištěna jasná struktura a lepší udržovatelnost.

Mohu používat lokální proměnné mimo jejich funkci?Ne, lokální proměnné jsou viditelné pouze uvnitř funkce, ve které byly definovány.

Jak řešit chyby undefined?Dávejte pozor na pořadí definice proměnných a funkcí, abyste zajistili, že potřebné proměnné jsou definovány před jejich použitím.