Zmienne JavaScript mogą należeć do zakresu lokalnego lub globalnego.
Zmienne globalne mogą być lokalne (prywatne) za pomocą zamknięć.
Zmienne globalne
Akcja function może uzyskać dostęp do wszystkich zmiennych zdefiniowanych wewnątrz funkcji, jak poniżej:
Przykład
var a = 4;
return a * a;
}
Try it Yourself ”
Ale function może również uzyskać dostęp do zmiennych zdefiniowanych poza funkcją, jak na przykład:
Przykład
function myFunction() {
return a * a;
}
Try it Yourself ”
W ostatnim przykładzie a jest zmienną globalną.
Na stronie internetowej zmienne globalne należą do obiektu okna.
Zmienne globalne mogą być używane (i zmieniane) przez wszystkie skrypty na stronie (i w oknie).
W pierwszym przykładzie a jest zmienną lokalną.
Zmienna lokalna może być używana tylko wewnątrz funkcji, w której została zdefiniowana. Jest ona ukryta przed innymi funkcjami i innym kodem skryptowym.
Zmienne globalne i lokalne o tej samej nazwie są różnymi zmiennymi. Modyfikacja jednej z nich nie powoduje modyfikacji drugiej.
Zmienne utworzone bez słowa kluczowego deklaracji (varlet, lub const) są zawsze globalne, nawet jeśli są utworzone wewnątrz funkcji.
Czas życia zmiennych
Zmienne globalne żyją do momentu wyrzucenia strony, np. po przejściu na inną stronę lub zamknięciu okna.
Zmienne lokalne mają krótkie życie. Są tworzone w momencie wywołania funkcji i usuwane po jej zakończeniu.
Dylemat licznika
Załóżmy, że chcesz użyć zmiennej do liczenia czegoś i chcesz, aby ten licznik był dostępny dla wszystkich funkcji.
Mógłbyś użyć zmiennej globalnej, oraz function do zwiększenia licznika:
Przykład
var licznik = 0;
/// Funkcja zwiększająca licznik
function add() {
licznik += 1;
}
// Wywołaj add() 3 razy
add();
add();
/ Licznik powinien teraz wynosić 3
Spróbuj sam ”
Z powyższym rozwiązaniem jest pewien problem: Dowolny kod na stronie może zmienić licznik, bez wywoływania add().
Licznik powinien być lokalny do funkcji add(), aby uniemożliwić innemu kodowi jego zmianę:
Przykład
var licznik = 0;
// Funkcja inkrementująca licznik
function add() {
var licznik = 0;
counter += 1;
}
// Wywołaj add() 3 razy
add();
add();
add();
//Licznik powinien teraz wynosić 3. Ale jest 0
Spróbuj sam ”
Nie zadziałało, ponieważ wyświetlamy globalny licznik zamiast lokalnego.
Możemy usunąć globalny licznik i uzyskać dostęp do lokalnego licznika, pozwalając funkcji go zwrócić:
Przykład
function add() {
var counter = 0;
counter += 1;
return counter;
}
// Wywołaj add() 3 razy
add();
add();
//The counter should now be 3. Ale jest 1.
Spróbuj sam ”
Nie zadziałało, ponieważ resetujemy lokalny licznik za każdym razem, gdy wywołujemy funkcję.
Funkcja wewnętrzna JavaScript może to rozwiązać.
Funkcje zagnieżdżone JavaScript
Wszystkie funkcje mają dostęp do zakresu globalnego.
W rzeczywistości, w JavaScript, wszystkie funkcje mają dostęp do zakresu „powyżej” nich.
JavaScript obsługuje funkcje zagnieżdżone. Funkcje zagnieżdżone mają dostęp do zakresu „powyżej” nich.
W tym przykładzie, funkcja wewnętrzna plus() ma dostęp do zmiennej counter w funkcji nadrzędnej:
Przykład
var counter = 0;
function plus() {counter += 1;}
plus();
return counter;
}
Spróbuj sam ”
To mogło rozwiązać dylemat licznika, gdybyśmy mogli dotrzeć do funkcji plus() z zewnątrz.
Musimy też znaleźć sposób na wykonanie counter = 0 tylko raz.
Potrzebujemy closure.
JavaScript Closures
Pamiętasz funkcje wywołujące siebie? Co robi ta funkcja?
Przykład
var counter = 0;
return function () {counter += 1; return counter}
})();
add();
add();
add();
// licznik wynosi teraz 3
Try it Yourself ”
Przykład objaśniony
Zmienna add jest przypisana do wartości zwracanej przez funkcję samowywołującą.
Funkcja wywołująca się sama uruchamia się tylko raz. Ustawia licznik na zero (0) i zwraca wyrażenie funkcyjne.
W ten sposób add staje się funkcją. Wspaniałą” częścią jest to, że może ona uzyskać dostęp do licznika w zakresie nadrzędnym.
To się nazywa zamknięcie JavaScript. Dzięki temu funkcja może mieć „prywatne” zmienne.
Licznik jest chroniony przez zakres funkcji anonimowej i może być zmieniony tylko za pomocą funkcji add.
Zamknięcie to funkcja mająca dostęp do zakresu nadrzędnego, nawet po zamknięciu funkcji nadrzędnej.