W tym samouczku nauczysz się zakresu zmiennych w JavaScript na podstawie przykładów.
Zakres odnosi się do dostępności zmiennych i funkcji w określonych częściach kodu.
W JavaScript zmienna ma dwa typy zasięgu:
- Zakres globalny
- Zakres lokalny
Zakres globalny
Zmienna zadeklarowana w górnej części programu lub poza funkcją jest uważana za zmienną o zasięgu globalnym.
Zobaczmy przykład zmiennej o zasięgu globalnym.
// program to print a text let a = "hello"; function greet () ( console.log(a); ) greet(); // hello
W powyższym programie zmienna a jest zadeklarowana na początku programu i jest zmienną globalną. Oznacza to, że zmienna a
może być używana w dowolnym miejscu programu.
Wartość zmiennej globalnej można zmienić wewnątrz funkcji. Na przykład,
// program to show the change in global variable let a = "hello"; function greet() ( a = 3; ) // before the function call console.log(a); //after the function call greet(); console.log(a); // 3
W powyższym programie zmienna a jest zmienną globalną. Wartość a to hello. Następnie zmienna a jest dostępna wewnątrz funkcji i wartość zmienia się na 3.
Stąd wartość a zmienia się po zmianie jej wewnątrz funkcji.
Uwaga : Dobrą praktyką jest unikanie używania zmiennych globalnych, ponieważ wartość zmiennej globalnej może się zmieniać w różnych obszarach programu. Może wprowadzić do programu nieznane wyniki.
W JavaScript zmiennej można również używać bez jej deklarowania. Jeśli zmienna jest używana bez jej deklarowania, staje się ona automatycznie zmienną globalną.
Na przykład,
function greet() ( a = "hello" ) greet(); console.log(a); // hello
W powyższym programie zmienna a jest zmienną globalną.
Jeśli zmienna została zadeklarowana przy użyciu let a = "hello"
, program zgłosiłby błąd.
Uwaga : w JavaScript istnieje sytuacja, "strict mode";
w której nie można użyć zmiennej bez jej zadeklarowania. Aby dowiedzieć się więcej o ścisłym, odwiedź JavaScript Strict.
Zakres lokalny
Zmienna może mieć również zasięg lokalny, tj. Można uzyskać do niej dostęp tylko w ramach funkcji.
Przykład 1: Zmienna o zasięgu lokalnym
// program showing local scope of a variable let a = "hello"; function greet() ( let b = "World" console.log(a + b); ) greet(); console.log(a + b); // error
Wynik
helloWorld Uncaught ReferenceError: b nie jest zdefiniowana
W powyższym programie zmienna a jest zmienną globalną, a zmienna b jest zmienną lokalną. Zmienna b jest dostępna tylko wewnątrz funkcji greet. Dlatego, gdy próbujemy uzyskać dostęp do zmiennej b poza funkcją, pojawia się błąd.
niech ma zakres blokowy
let
Słowo kluczowe jest zawężona bloku (zmienna mogą być dostępne tylko w bezpośrednim bloku).
Przykład 2: zmienna o zasięgu bloku
// program showing block-scoped concept // global variable let a = 'Hello'; function greet() ( // local variable let b = 'World'; console.log(a + ' ' + b); if (b == 'World') ( // block-scoped variable let c = 'hello'; console.log(a + ' ' + b + ' ' + c); ) // variable x cannot be accessed here console.log(a + ' ' + b + ' ' + c); ) greet();
Wynik
Hello World Hello World hello Uncaught ReferenceError: x nie jest zdefiniowany
W powyższym programie zmienna
- a jest zmienną globalną. Dostęp do niego można uzyskać w dowolnym miejscu programu.
- b jest zmienną lokalną. Dostęp do niego można uzyskać tylko wewnątrz funkcji
greet
. - c jest zmienną o zasięgu bloku. Dostęp do niego można uzyskać tylko w
if
bloku instrukcji.
Stąd w powyższym programie pierwsze dwa console.log()
działają bez problemu.
Jednak próbujemy uzyskać dostęp do zmiennej c o zasięgu bloku poza blokiem w trzecim console.log()
. Spowoduje to wyświetlenie błędu.
Uwaga : w JavaScript var
ma zasięg funkcji i let
bloków. Jeśli spróbujesz użyć var c = 'hello';
wewnątrz if
instrukcji w powyższym programie, cały program działa, ponieważ c jest traktowane jako zmienna lokalna.
Aby dowiedzieć się więcej o let
versus var
, odwiedź JavaScript let vs var.