Zakres zmiennych JavaScript (z przykładami)

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:

  1. Zakres globalny
  2. 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 amoż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

letSł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 ifbloku 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 varma zasięg funkcji i letbloków. Jeśli spróbujesz użyć var c = 'hello';wewnątrz ifinstrukcji w powyższym programie, cały program działa, ponieważ c jest traktowane jako zmienna lokalna.

Aby dowiedzieć się więcej o letversus var, odwiedź JavaScript let vs var.

Interesujące artykuły...