Zmienne w JavaScript są niezbędne do przechowywania i przetwarzania danych. Ważne jest, aby zrozumieć, gdzie te zmienne są ważne i do jakich obszarów twojego kodu mogą uzyskiwać dostęp. Ze względu na różne rodzaje zmiennych – globalne i lokalne – zrozumienie „zakresu” (scope) ma zasadnicze znaczenie. Zanurzmy się więc i dowiedzmy się, co takiego mają globalne i lokalne zmienne.
Najważniejsze spostrzeżenia
- Zmienne globalne są dostępne w całym kodzie, podczas gdy zmienne lokalne są widoczne tylko w obrębie swojej funkcji.
- Definiowanie zmiennej poza funkcją czyni ją globalną, podczas gdy definiowanie wewnątrz funkcji czyni ją lokalną.
- Aby uzyskać klarowną i łatwą w utrzymaniu strukturę kodu, warto zadeklarować zmienne globalne na początku skryptu.
Instrukcja krok po kroku
Definicja zmiennych i ich widoczność
W pierwszym kroku przyjrzymy się, jak utworzyć zmienną i co oznacza jej widoczność. Gdy zadeklarujesz zmienną poza każdą funkcją, jak w poniższym przykładzie, jest ona globalna.
Tutaj tworzymy zmienną globalną o nazwie mojeVariable.
Tworzenie funkcji z lokalnymi zmiennymi
Następnie stworzymy dwie funkcje. Jedną funkcję nazwiemy lokalnaFunkcja, w której utworzymy lokalną zmienną. Ta zmienna jest widoczna tylko w obrębie funkcji. Zdefiniujmy więc naszą funkcję.
W lokalnaFunkcja tworzysz lokalną zmienną lokalnaV z wartością 5 i wyświetlasz ją.
Wywoływanie funkcji
Teraz chcemy wywołać lokalnaFunkcja, aby wyświetlić liczbę 5. Po wywołaniu funkcji w kodzie, wynik będzie wyglądał tak:
Testowanie widoczności lokalnej zmiennej
Teraz spróbujemy użyć lokalnej zmiennej lokalnaV w innej funkcji. Zauważysz, że to nie działa. Zróbmy wywołanie innejFunkcja i zobaczmy, co się stanie.
Otrzymujemy błąd, ponieważ zmienna lokalnaV jest widoczna tylko wewnątrz lokalnaFunkcja.
Sprawdzanie błędów w konsoli
Aby lepiej zrozumieć, dlaczego występuje błąd, dokładnie przeanalizujmy kod w konsoli. Klikając prawym przyciskiem myszy i wybierając „Zbadaj”, możesz otworzyć eksplorator DOM i konsolę, aby przeanalizować błąd.
Pokazuje to, że lokalnaV jest undefined. To potwierdza, że zmienna nie istnieje poza swoją funkcją.
Definiowanie globalnej zmiennej
Teraz stwórzmy globalną zmienną, którą możemy używać w obu funkcjach. Nazwiemy tę zmienną globalnaZmienna i przypiszemy jej prostą wartość tekstową.
Teraz ta globalna zmienna może być wywoływana w obu funkcjach, a wynik będzie taki sam. Przetestujmy to.
Definicja zmiennych i kolejność wywołania
Ważne jest, aby zauważyć, że kolejność definicji zmiennych i funkcji ma kluczowe znaczenie. Jeśli stworzysz zmienną globalną poniżej jej użycia, spowoduje to problem undefined.
Wynika to z faktu, że funkcja, która potrzebuje zmiennej globalnej, wywołuje ją przed jej definicją. Aby tego uniknąć, zaleca się definiowanie zmiennych globalnych na początku kodu.
Więcej o lokalnych zmiennych i ich zastosowaniach
Teraz stwórzmy ponownie lokalną zmienną w innej funkcji. Nazwiemy ją lokalnaZmienna i ustawimy jej wartość na 12.
Możemy również używać tej lokalnej zmiennej, ale tylko w obrębie jej własnej funkcji, a nie w innych. Używanie obu lokalnych zmiennych może wprowadzić porządek i organizację w twoich programach, w zależności od złożoności.
Podsumowanie koncepcji
Teraz rozumiesz podstawowe koncepcje dotyczące widoczności i zakresu zmiennych w JavaScript. Zmienne globalne są widoczne dla wszystkich funkcji, podczas gdy zmienne lokalne istnieją tylko w obrębie swojej funkcji. Warto definiować zmienne globalne w centralnym miejscu kodu, aby poprawić czytelność i łatwość w utrzymaniu.
Podsumowanie – Widoczność zmiennych w JavaScript
Podsumowując, nauczyłeś się, że sposób, w jaki definiujesz zmienne, ma bezpośredni wpływ na ich widoczność i zakres. Zawsze zwracaj uwagę na to, gdzie umieszczasz swoje zmienne, aby unikać błędów.
Najczęściej zadawane pytania
Co to są zmienne globalne?Zmienne globalne to zmienne, które są zadeklarowane poza funkcjami i w ten sposób są dostępne w całym skrypcie.
Co to są zmienne lokalne?Zmienne lokalne to zmienne, które są tworzone wewnątrz funkcji i są widoczne tylko w tej funkcji.
Jak najlepiej korzystać ze zmiennych globalnych?Zaleca się definiowanie zmiennych globalnych na początku skryptu, aby zapewnić klarowną strukturę i lepszą utrzymywność.
Czy mogę używać zmiennych lokalnych poza ich funkcją?Nie, zmienne lokalne są widoczne tylko w obrębie funkcji, w której zostały zdefiniowane.
Jak radzić sobie z błędami undefined?Zwróć uwagę na kolejność, w jakiej definiujesz zmienne i funkcje, aby upewnić się, że potrzebne zmienne są zdefiniowane przed ich użyciem.
