Zakres zmiennych funkcyjnych w JavaScript - Zmienne globalne i lokalne. Zakres zmiennych JavaScript. Zmienne lokalne i globalne

Wszystkie zmienne i funkcje globalne są w rzeczywistości właściwościami i metodami specjalnego obiektu zwanego obiektem globalnym.

Obiekt globalny to zwykły obiekt tworzony automatycznie podczas uruchamiania interpretera.

W JavaScript rolę obiektu globalnego pełni obiekt Window. Obiekt ten posiada właściwość window, która odnosi się do samego obiektu Window. Obiekt Window jest zarówno obiektem globalnym, jak i dodatkowo zawiera szereg własnych właściwości i metod pracy z oknem przeglądarki.

W kod programu Do obiektu globalnego najwyższego poziomu można również odwoływać się za pomocą słowa kluczowego this:

Alert(to === okno); // PRAWDA

Ponieważ zmienne globalne są właściwościami obiektu globalnego, pracując ze zmienną globalną, tak naprawdę pracujemy z właściwościami okna:

Liczba zmiennych = 10; alert(okno.num); // 10

Zamiast deklarować zmienną za pomocą słowa kluczowego var, możesz utworzyć zmienną, jawnie określając nową właściwość obiektu Window:

Okno.num = 10; alert(liczba); // 10

Należy pamiętać, że chociaż zmienne globalne są w rzeczywistości właściwościami obiektu Window, nie jest konieczne poprzedzanie nazwy zmiennej:

Liczba zmiennych = 10; alert(liczba); // 10 alert(window.num); // 10. To samo co alert(num);

Jeśli zmienna globalna zostanie zadeklarowana przy użyciu słowa kluczowego var lub let, zostanie utworzona właściwość niekonfigurowalna, czyli taka, której nie można usunąć za pomocą operatora usuwania:

Liczba zmiennych = 10; alert(usuń numer); // false, zmienna nie zostanie usunięta

Jeśli przypiszesz wartość do niezadeklarowanej zmiennej, interpreter JavaScript automatycznie utworzy zmienną globalną. Utworzone w ten sposób zmienne stają się zwykłymi, niestandardowymi właściwościami obiektu globalnego, czyli można je usunąć za pomocą operatora usuwania:

Liczba = 10; alert(usuń numer); // prawda, zmienna została usunięta

Dzień dobry, fani JavaScript i moi lojalni subskrybenci. W dzisiejszym poście opowiem szczegółowo o tym jak w JavaScript tworzone są zmienne globalne i lokalne. Na pewno zdefiniuję ważne pojęcia, opowiem o możliwościach deklarowania i inicjowania zmiennych, opiszę czym jest zakres i jak funkcjonują w nim utworzone elementy.

Wszystko to dotyczy najbardziej podstawowej, podstawowej znajomości języka. Bez zrozumienia tego wszystkiego nie będziesz w stanie ruszyć dalej i rozwijać swoich umiejętności programowania w js. Ponadto kluczowe pojęcia przydadzą Ci się nie tylko w tej specjalizacji, ale także w branży IT w ogóle. Cóż, zaczynajmy!

Zmienna to element języka programowania, dla którego przydzielony jest obszar pamięci i w którym przechowywane są określone wartości.

Zmiennych może być ogromna liczba i wszystkie muszą mieć unikalną nazwę.

Istnieją dwa typy zmiennych: globalne i lokalne. Różnica polega jedynie na innym zakresie zmiennych. Zatem elementy globalne są widoczne w całym kodzie, a elementy lokalne są widoczne tylko na niewielkim obszarze, w którym zostały zadeklarowane.

Swoją drogą staraj się od pierwszego dnia, od pierwszego kodu, nazywać elementy logicznymi i zrozumiałymi nazwami. Bo później, pracując z ciężkimi programami, po pewnym czasie nie będziesz pamiętał, co oznacza na przykład „aa1” lub „perem3”.

I absolutnie nic nie jest jasne z tytułu! Nie jest to takie złe, w końcu zrozumienie własnych pism nie jest takie trudne. Co zrobisz, jeśli otrzymasz zadanie dokończenia zadań w innym programie, o którym nawet nigdy wcześniej nie słyszałeś? Przy takich nazwach analiza implementacji oprogramowania zabierze dużo przydatnego czasu.

Przeczytałem notację, teraz wróćmy do deklarowania zmiennych.

Aby utworzyć zmienną, należy najpierw wpisać słowo kluczowe var, a następnie samą nazwę. Oto jak to wygląda:

var tekst = „Witaj, użytkowniku!”

Następnie dostęp do tekstu odbywa się bez „var”:

tekst = „Nowy tekst”.

W takim przypadku wartość zostanie nadpisana.

Dla lepszego zrozumienia rozważmy przykład, w którym tworzona jest pojedyncza zmienna. Do jego znaczenia zwrócimy się przed i po przepisaniu.

var tekst = „Witaj, użytkowniku!”; alert(tekst); // wypisze „Witaj, użytkowniku!” tekst = „Nowy tekst!”; alert(tekst); // wypisze „Nowy tekst!”

Wszystkie utworzone obiekty w kodzie js są podzielone na globalne i lokalne. Powyżej wyjaśniłem, jaka jest różnica między nimi. Przyjrzyjmy się teraz bliżej obiektom globalnym.

Są to wszystkie funkcje i zmienne zadeklarowane w głównej części kodu, tj. nie wewnątrz żadnych funkcji. Wszystkie w js automatycznie stają się właściwościami obiektu globalnego, który w przeglądarkach jest wyraźnie dostępny pod słowem window. Spójrzmy na przykład.

zmienna cena = 145; // utwórz zmienną globalną

alert(okno.cena); // odpowiedź: 145

Jak dotąd wszystko jest proste, ale bądź przygotowany na pułapki. Czasami, nie znając specyfiki zapisywania i nadpisywania wartości zmiennych, można nadpisać bardzo ważne parametry. Takie błędy są dość trudne do wyśledzenia i niemożliwe do znalezienia za pomocą kompilatorów. Dlatego dokładnie przeanalizuj poniższy materiał.

Aby lepiej zrozumieć problem, najpierw pokażę mały program, gdzie w funkcji utworzę zmienną lokalną, a następnie poza jej granicami - globalną.

test funkcji() ( p = 2; return p; ) alert(p); // niezdefiniowany p = „ważny tekst”; alert(p); // wyświetli „ważny tekst” test(); // wywołaj funkcję alert(p); // wydrukuje 2

Początkowo w funkcji testowej zainicjowałem zmienną lokalną o wartości 2, a następnie utworzyłem globalną zmienną tekstową, która przechowuje kilka ważnych danych.

I tu pojawia się ten „podwodny blok”.

Po pierwsze, w związku z tym, że zastosowałem tworzenie elementów według zasad przestarzałego standardu JavaScript, wszystkie zmienne „p” powstały dopiero w momencie przypisania (przy zastosowaniu dyrektywy var zmienne tworzone są od razu z wartością niezdefiniowany, a podczas inicjalizacji przez „= » wartość jest nadpisywana).

Po drugie, w tym przypadku, aby przypisać wartość do elementów utworzonych implicite w js, wykorzystuje się istniejącą lub tworzy się nową zmienną globalną. Zatem w powyższym przykładzie po wywołaniu funkcji testowej została utracona wartość globalnego „p”.

Aby uniknąć awarii, zawsze używaj słowa kluczowego var. Następnie wszystkie obiekty zostaną jawnie zadeklarowane i utworzone zostaną nowe.

Oto poprawiony przykład:

test funkcji() ( var p = 2; alert (p); return p; ) alert(p); // niezdefiniowany var p = "ważny tekst"; alert(p); // wyświetli „ważny tekst” test(); // wywołaj funkcję, w tym przypadku wyświetli się 2 alert(p); // wyświetli „ważny tekst”

Teraz kod działa poprawnie. Jak zauważyłeś, zakres lokalnego „p” znajduje się w funkcji testowej, a globalny w pozostałej części kodu.

Podobnie jak wszystkie inne języki programowania, JavaScript ma stałe. Dla tych, którzy nie wiedzą co to jest, załączam definicję.

Stała to typ zmiennej, której wartość pozostaje niezmieniona.

Zgodnie z zasadami składni w js, ich nazwa jest zawsze pisana małymi (wielkimi) literami. Na przykład,

var MAIN_COLOR = „#fff”

Nie w języku skryptowym środki techniczne, co sprawiłoby, że stała byłaby naprawdę stałą. W rzeczywistości są to zwykłe zmienne, które można nadpisać. Jednak zgodnie z zasadami programiści używają tych elementów pisanych wielkimi literami w nazwie jako stałych i nie zmieniają ich znaczenia podczas pisania kodu.

Głównym celem stałych jest przechowywanie skomplikowanych ciągów znaków, ważnych liczb lub innych wartości, w których po ponownym zapisaniu łatwo jest popełnić literówkę lub nigdy nie należy ich zmieniać, lub uprościć kod. Na przykład stałych można używać do przechowywania często powtarzanych żądań

Zmienne służą jako „pojemniki” do przechowywania informacji.

Czy pamiętasz algebrę szkolną? x=5, y=6, z=x+y

Czy pamiętasz, że litera (np. x) może służyć do przechowywania wartości (np. 5) i że możesz wykorzystać powyższe informacje do obliczenia, że ​​wartość z wynosi 11?

Litery te nazywane są zmiennymi, a zmienne mogą służyć do przechowywania wartości (x=5) lub wyrażeń (z=x+y).

Podobnie jak w algebrze, zmienne JavaScript służą do przechowywania wartości lub wyrażeń.

Zmienna może mieć krótką nazwę, np. x, lub nazwę bardziej opisową, np. carname.

Reguły dla nazw zmiennych JavaScript:

• W nazwach zmiennych rozróżniana jest wielkość liter (y i Y to dwie różne zmienne)
• Nazwy zmiennych muszą zaczynać się od litery lub znaku podkreślenia

Uwaga: Ponieważ w JavaScript rozróżniana jest wielkość liter, w nazwach zmiennych wielkość liter również jest uwzględniana.

Wartość zmiennej może ulec zmianie podczas działania skryptu.

Deklarowanie (tworzenie) zmiennych JavaScript

Tworzenie zmiennych w JavaScript jest częściej określane jako „deklarowanie” zmiennych.

Deklarujesz zmienne JavaScript za pomocą słowa kluczowego var:

Po wykonaniu powyższych instrukcji zmienna x będzie zawierać wartość 5, a nazwa samochodu będzie zawierać wartość Mercedes. Uwaga: Kiedy przypiszesz wartość tekstowa

zmienną, należy ją ująć w cudzysłów.

Zmienne lokalne JavaScript Zmienna zadeklarowana wewnątrz Funkcje JavaScriptu

staje się LOKALNY i będzie dostępny tylko w ramach tej funkcji.

(zmienna ma zasięg lokalny).

Zmienne lokalne o tej samej nazwie można deklarować w różnych funkcjach, ponieważ zmienne lokalne są rozpoznawane w funkcji, w której zostały zadeklarowane.

Więcej o funkcjach dowiesz się z kolejnych lekcji JavaScript.

Zmienne globalne JavaScript

Zmienne zadeklarowane poza funkcją stają się GLOBALNE i wszystkie skrypty i funkcje na stronie mają do nich dostęp.

Jeśli zadeklarujesz zmienną bez użycia „var”, zmienna zawsze stanie się GLOBALNA.

Przypisywanie wartości do niezadeklarowanych zmiennych JavaScript

Jeśli przypiszesz wartości zmiennym, które nie zostały jeszcze zadeklarowane, zmienne zostaną automatycznie zadeklarowane jako zmienne globalne.

Te oferty:

Więcej o operatorach dowiesz się z następnej lekcji JavaScript.

Wszystkie zmienne w JavaScript mają określony zakres, w którym mogą działać.

Zmienne globalne

Wszystkie zmienne zadeklarowane poza funkcjami są globalne:

zmienna x = 5; niech d = 8; funkcja displaySquare())( var z = x * x; console.log(z); )

Zmienna zdefiniowana wewnątrz funkcji jest lokalna:

Funkcja displaySquare())( var z = 10; console.log(z); niech b = 8; console.log(b); )

Zmienne z i b są lokalne, istnieją tylko wewnątrz funkcji. Nie można ich używać poza funkcją:

Funkcja displaySquare())( var z = 10; console.log(z); ) console.log(z); //błąd, ponieważ z nie jest zdefiniowane

Kiedy funkcja zakończy swoją pracę, wszystkie zmienne zdefiniowane w tej funkcji ulegają zniszczeniu.

A co jeśli mamy dwie zmienne – jedną globalną i drugą lokalną – o tej samej nazwie:

Var z = 89; funkcja displaySquare())( var z = 10; console.log(z); // 10 ) displaySquare(); // 10

W tym przypadku funkcja użyje zmiennej z zdefiniowanej bezpośrednio w funkcji. Oznacza to, że zmienna lokalna ukryje zmienną globalną.

Podczas korzystania z instrukcji let każdy blok kodu definiuje nowy zakres, w którym istnieje zmienna. Przykładowo możemy jednocześnie zdefiniować zmienną na poziomie bloku i na poziomie funkcji:

Niech z = 10; funkcja displayZ())( niech z = 20; ( niech z = 30; console.log("Blok:", z); ) console.log("Funkcja:", z); ) displayZ(); console.log("Globalny:", z);

Tutaj, wewnątrz funkcji displayZ, zdefiniowany jest blok kodu, w którym zdefiniowana jest zmienna z. Ukrywa zmienną globalną i zmienną z zdefiniowaną na poziomie funkcji. W prawdziwy program block może reprezentować funkcję zagnieżdżoną, block dla pętli lub jeśli konstruuje. Ale w każdym razie taki blok definiuje nowy zakres, poza którym zmienna nie istnieje.

i w w tym przypadku otrzymamy następujące dane wyjściowe konsoli:

Blok: 30 Funkcja: 20 Global: 10

Za pomocą operatora var nie możemy zdefiniować zmiennej o tej samej nazwie zarówno w funkcji, jak i w bloku kodu w ramach tej funkcji:

Funkcja displaySquare())( var z = 20; ( var z = 30; // Błąd! Zmienna z jest już zdefiniowana console.log("Blok:", z); ) console.log("Funkcja:", z) ;)

Oznacza to, że za pomocą var możemy zdefiniować zmienną o pojedynczej nazwie na poziomie funkcji lub na poziomie bloku kodu.

Wszystko, co dotyczy operatora let, dotyczy również operatora const, który pozwala na definiowanie stałych. Bloki kodu definiują zakres stałych, a stałe zdefiniowane w zagnieżdżonych blokach kodu ukrywają zewnętrzne stałe o tej samej nazwie:

Stała z = 10; funkcja displayZ())( const z = 20; ( const z = 30; console.log("Blok:", z); // 30 ) console.log("Funkcja:", z); // 20 ) displayZ ( ); console.log("Globalny:", z); // 10

Jeśli nie użyjemy tego słowa kluczowego przy definiowaniu zmiennej w funkcji, to taka zmienna będzie globalna. Na przykład:

Funkcja bar())( foo = "25"; ) bar(); konsola.log(foo); // 25

Chociaż zmienna foo nie jest zdefiniowana nigdzie poza funkcją bar, jest ona jednak dostępna poza funkcją w kontekście zewnętrznym.

Inaczej byłoby, gdybyśmy nie tylko przypisywali wartość zmiennej, ale także ją zdefiniowali:

Funkcja bar())( var foo = "25"; ) bar(); konsola.log(foo); // błąd

Zdefiniowanie zmiennych globalnych w funkcjach może prowadzić do: potencjalne błędy. Aby ich uniknąć, użyj trybu ścisłego:

„użyj ściśle”; funkcja bar())( foo = "25"; ) bar(); konsola.log(foo);

W takim przypadku otrzymamy błąd SyntaxError: Nieoczekiwany identyfikator, który wskazuje, że zmienna foo nie jest zdefiniowana.

Istnieją dwa sposoby ustawienia trybu ścisłego:

dodaj wyrażenie „use strict” na początku kodu JavaScript, wówczas do całego kodu zostanie zastosowany tryb ścisły

dodaj wyrażenie „użyj ścisłego” na początku treści funkcji, wówczas tryb ścisły zostanie zastosowany tylko do tej funkcji

Zmienne

Zanim będzie można użyć zmiennej w JavaScript, należy ją zadeklarować. Zmienne deklaruje się za pomocą słowa kluczowego var w następujący sposób:

Var i; suma zmienna;

Używając raz słowa kluczowego var, możesz zadeklarować wiele zmiennych:

Deklarowanie zmiennych można połączyć z ich inicjalizacją:

Var wiadomość = „cześć”; var i = 0, j = 0, k = 0;

Jeżeli w instrukcji var nie określono wartości początkowej, zmienna jest deklarowana, ale jej wartość początkowa pozostaje niezdefiniowana, dopóki nie zostanie zmieniona przez program.

Jeżeli masz doświadczenie w używaniu języków programowania ze statycznymi typami danych, takimi jak C# czy Java, możesz zauważyć, że w deklaracjach zmiennych w JavaScript brakuje deklaracji typu. Zmienne w JavaScript mogą przechowywać wartości dowolnego typu. Na przykład w JavaScript możesz przypisać liczbę do zmiennej, a następnie przypisać ciąg znaków do tej samej zmiennej:

Var i = 10; ja = „cześć”;

Za pomocą instrukcji var możesz zadeklarować tę samą zmienną więcej niż raz. Jeżeli powtarzana deklaracja zawiera inicjator, wówczas zachowuje się jak zwykła instrukcja przypisania.

Jeśli spróbujesz odczytać wartość niezadeklarowanej zmiennej, JavaScript wygeneruje błąd. W trybie ścisłym zapewnianym przez standard ECMAScript 5 błąd pojawia się także przy próbie przypisania wartości do niezadeklarowanej zmiennej. Jednak historycznie rzecz biorąc, jeśli nie jest wykonywany w trybie ścisłym, jeśli przypiszesz wartość do zmiennej, która nie jest zadeklarowana za pomocą instrukcji var, JavaScript utworzy tę zmienną jako właściwość obiektu globalnego i będzie działać prawie tak samo jak poprawnie zadeklarowana zmienna. Oznacza to, że nie trzeba deklarować zmiennych globalnych. Jest to jednak uważane za zły nawyk i może powodować błędy, dlatego zawsze staraj się deklarować zmienne za pomocą var.

Zasięg zmiennej to część programu, dla której zmienna jest zdefiniowana. Zmienna globalna ma zasięg globalny - jest zdefiniowana dla całego programu JavaScript. Jednocześnie zmienne zadeklarowane wewnątrz funkcji definiowane są tylko w jej treści. Nazywa się je lokalnymi i ma zasięg lokalny. Parametry funkcji są również uważane za zmienne lokalne, zdefiniowane tylko w treści tej funkcji.

W treści funkcji zmienna lokalna ma pierwszeństwo przed zmienną globalną o tej samej nazwie. Jeśli zadeklarujesz zmienną lokalną lub parametr funkcji o tej samej nazwie co zmienna globalna, zmienna globalna będzie faktycznie ukryta:

Var wynik = „globalny”; funkcja getResult() ( var wynik = "lokalny"; zwróć wynik; ); konsola.log(getResult()); // Wyświetl „lokalne”

Deklarując zmienne o zasięgu globalnym, instrukcję var można pominąć, natomiast deklarując zmienne lokalne, należy zawsze używać instrukcji var.