0Pricing
JavaScript Academy · Lekcja

Zakres blokowy, funkcyjny i modułowy oraz TDZ

Poznaj zakres blokowy, funkcyjny i modułowy; zobacz TDZ w działaniu i unikaj wyciekania zmiennych.

Zakres blokowy, funkcyjny i modułowy oraz TDZ to bezpłatna lekcja JavaScript Academy na CoddyKit. To lekcja 2 z 3. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej JavaScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs JavaScript Academy zawiera 3 lekcji w sumie.

Wprowadzenie

Cel: Należy wiedzieć, gdzie znajdują się zmienne i kiedy można ich używać.

  • Zakres blokowy (let/const)
  • Zakres funkcji (var)
  • Zakres modułu
  • Bezpieczeństwo dzięki TDZ
Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 1

Przykład zakresu blokowego

Zakres blokowy utrzymuje zmienne lokalnie w obrębie pary nawiasów klamrowych.

// Block scope: let/const exist only inside the braces
let lives = 3;

if (true) {
  const bonus = 5;
  let level = 1;
  console.log("Inside block:", bonus, level);
}

console.log("Lives:", lives);
// Uncommenting next line would fail (not in scope):
// console.log(bonus, level);
Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 2

Zakres funkcji z var

var ma zakres funkcji, a nie zakres blokowy. We współczesnym JS należy preferować let/const.

// Function scope: var is visible across the whole function
function demo() {
  if (true) {
    var x = 10; // function-scoped
  }
  console.log("x is visible here:", x); // 10
}
demo();
Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 3

Podstawy zakresu modułu

Zakres modułu: powiązania na najwyższym poziomie są lokalne dla pliku (moduły ES).

// Module scope: top-level variables are local to the module file
const appName = "CoddyKit";
console.log("App name:", appName);

// In a real project, this would be its own file/module.
// Other files must import to access appName.
Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 4

Temporal Dead Zone

TDZ zapobiega przypadkowemu odczytowi przed deklaracją. Najpierw należy zadeklarować zmienną, a dopiero potem jej użyć.

// TDZ: using let/const before declaration throws ReferenceError
try {
  // Uncommenting would trigger TDZ:
  // console.log(mode); // ReferenceError
  let mode = "dark";
  console.log("Mode after declare:", mode);
} catch (e) {
  console.log("Caught:", e.message);
}
Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 5

Pułapki zakresów

Pułapki:

  • Nie należy łączyć var z let/const w tym samym zakresie.
  • Należy deklarować zmienne blisko miejsca użycia.
  • Należy unikać odczytywania wartości przed wierszem deklaracji (TDZ).
Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 6

Quiz: TDZ

Szybkie sprawdzenie: działanie TDZ.

Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 7

Podsumowanie

Podsumowanie: let/const mają zakres blokowy, var ma zakres funkcji, moduły mają własny zakres pliku, a TDZ blokuje zbyt wczesny dostęp.

Zakres blokowy, funkcyjny i modułowy oraz TDZ — ilustracja 8

Często zadawane pytania

Czy lekcja „Zakres blokowy, funkcyjny i modułowy oraz TDZ” jest bezpłatna?

Tak — pełny tekst „Zakres blokowy, funkcyjny i modułowy oraz TDZ” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu JavaScript Academy, przejdź na CoddyKit PRO. Kurs JavaScript Academy zawiera 3 lekcji w sumie.

Co nauczysz się w „Zakres blokowy, funkcyjny i modułowy oraz TDZ”?

Poznaj zakres blokowy, funkcyjny i modułowy; zobacz TDZ w działaniu i unikaj wyciekania zmiennych. Ćwiczysz JavaScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć JavaScript Academy?

Nie wymagamy żadnego doświadczenia. JavaScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 3.

Ile czasu zajmuje lekcja „Zakres blokowy, funkcyjny i modułowy oraz TDZ”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji JavaScript Academy?

Tak. Każda lekcja JavaScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. let, const i unikanie var
  2. Zakres blokowy, funkcyjny i modułowy oraz TDZ
  3. Nazewnictwo, czytelność i typowe pułapki
← Powrót do JavaScript Academy