Lekcja 1 – Zmienne, Funkcje i Inne Cuda 🧙♂️✨
Witaj na pierwszym kroku w drodze do mistrzostwa w JavaScript! Na końcu tej lekcji będziesz dobrze rozumiał(a) zmienne i funkcje. I nie, nie potrzebujesz czapki czarodzieja ani doktoratu z programowania—wystarczy trochę ciekawości i może kubek kawy (lub herbaty, jeśli masz ochotę na coś bardziej wyrafinowanego).
Co To Są Zmienne? (Spoiler: Nie Są Takie Straszne)
Pomyśl o zmiennych jak o małych pudełkach, w które możesz wkładać informacje—trochę jak ta szuflada w domu, pełna „przydatnych rzeczy” na przyszłość. W JavaScript zmienne przechowują dane, których możesz używać i używać ponownie w swoim kodzie.
Deklarowanie Zmiennych
Aby zadeklarować zmienną, wystarczy ją przedstawić JavaScript. To tak, jakbyś mówił(a): “Hej, JavaScript, oto coś ważnego, co chcę zapamiętać.” Można to zrobić za pomocą var
, let
lub const
. Ale co wybrać? Zobaczmy:
var imieCzarodzieja = "Gandalf"; // Stary sposób. Nadal działa, ale to trochę jak korzystanie z maszyny do pisania w 2024 roku.
let poziomMagii = 100; // Nowoczesny, elastyczny sposób.
const rozdzka = "Drewniana"; // To jest stała. Jak już zadeklarujesz, to nie zmienisz. Jak przyjaciel, który nigdy nie zmienia ulubionego składnika pizzy.
var
: Stary sposób deklarowania zmiennych. Działa, ale nie jest tak fajny jaklet
iconst
.let
: Nowy sposób. Używaj, jeśli chcesz móc zmieniać wartość później.const
: Silny i stabilny. Raz zadeklarowany, nie można go zmienić—idealny do rzeczy, które nigdy nie powinny się zmieniać (jak epicka broda Gandalfa).
Funkcje: Superbohaterowie Kodu 🦸♂️
Funkcje w JavaScript to twoi osobisti superbohaterowie—wykonują zadania za ciebie. Dajesz im pracę, a oni ją robią (bez narzekania, w przeciwieństwie do niektórych bohaterów, których znamy).
Jak Zadeklarować Funkcję
Oto jak przedstawiasz funkcję w JavaScript:
function rzucZaklecie(nazwaZaklecia) {
console.log("Rzucasz zaklęcie: " + nazwaZaklecia);
}
rzucZaklecie("Expelliarmus"); // Wypisze: Rzucasz zaklęcie: Expelliarmus
W tym przykładzie:
function
to sposób na powiedzenie JavaScript: “Hej, chcę coś zrobić!”rzucZaklecie
to nazwa funkcji (możesz nazwać ją jak chcesz, nawet “zrobPizza”, jeśli masz taką ochotę).nazwaZaklecia
to parametr. Traktuj to jak magiczny składnik, którego funkcja potrzebuje do działania.console.log
to sposób, w jaki JavaScript krzyczy w pustkę. Wszystko, co umieścisz w nawiasach, pojawi się w konsoli przeglądarki.
Funkcje Strzałkowe (Po Co Pisać Więcej?)
Funkcje strzałkowe to krótszy sposób na pisanie funkcji. Gdyby funkcje JavaScript były SMS-ami, funkcje strzałkowe byłyby wersją pełną emotikonów. Szybciej, krócej i idealne, kiedy masz ochotę na trochę lenistwa.
Oto ta sama funkcja rzucZaklecie
, ale w formie funkcji strzałkowej:
const rzucZaklecie = (nazwaZaklecia) => {
console.log("Rzucasz zaklęcie: " + nazwaZaklecia);
};
To samo, ale mniej pisania. To jak przesiadka z roweru na sportowy samochód.
Czas na Trochę Praktyki! 🎩
Sprawdźmy twoje nowe umiejętności na małym zadaniu:
Zadanie: Stwórz Magiczny Eliksir
- Zadeklaruj zmienną o nazwie
nazwaEliksiru
i ustaw ją na"Eliksir Niewidzialności"
. - Napisz funkcję o nazwie
stworzEliksir
, która wypisze komunikat w stylu"Stworzyłeś Eliksir Niewidzialności!"
. - Wywołaj swoją funkcję i przekaż jej zmienną
nazwaEliksiru
.
Oto mała podpowiedź:
let nazwaEliksiru = "Eliksir Niewidzialności";
function stworzEliksir(nazwa) {
console.log("Stworzyłeś " + nazwa + "!");
}
stworzEliksir(nazwaEliksiru); // Wypisze: Stworzyłeś Eliksir Niewidzialności!
Gdzie Pisać Kod JavaScript?
Teraz, gdy jesteś gotowy(-a) wypróbować swoje nowe umiejętności w JavaScript, możesz zapytać: gdzie właściwie można pisać ten kod? Jednym z najprostszych sposobów jest użycie konsoli przeglądarki.
Konsola Przeglądarki: Twoje Pierwsze Pole do Eksperymentów z JavaScript
Większość nowoczesnych przeglądarek (jak Chrome, Firefox czy Edge) ma wbudowaną konsolę, w której możesz pisać i testować kod JavaScript na żywo.
- Jak otworzyć konsolę:
- Kliknij prawym przyciskiem myszy na dowolnym miejscu na stronie i wybierz Zbadaj lub Sprawdź element.
- Przejdź do zakładki Konsola.
- Teraz możesz pisać kod JavaScript bezpośrednio w konsoli i od razu zobaczyć wyniki.
Spróbuj tego:
console.log("Cześć, JavaScript!");
Otwórz konsolę w swojej przeglądarce, wpisz ten kod i naciśnij Enter. Zobaczysz, jak w konsoli pojawi się “Cześć, JavaScript!"—czysta magia!
Konsola przeglądarki to świetne miejsce do szybkiego testowania kodu, zwłaszcza gdy uczysz się podstaw.
Co Dalej?
W tej lekcji nauczyłeś(-aś) się, jak deklarować zmienne i tworzyć funkcje, które są podstawowymi elementami JavaScript. W następnej lekcji zajmiemy się pętlami i instrukcjami warunkowymi—bo nikt nie lubi się powtarzać (no, może poza Siri).
Gotowy(-a) na więcej magii w JavaScript? Sprawdź kolejną lekcję: Lekcja 2 – Pętle i Warunki: Jak Podejmować Decyzje i Powtarzać się Bez Utraty Rozumu.
Nie krępuj się eksperymentować z kodem i próbować różnych zaklęć lub eliksirów. Im więcej ćwiczysz, tym szybciej staniesz się prawdziwym magiem JavaScript!
Zobacz też
- Lekcja 6 – Delegowanie zdarzeń: Mistrzostwo w efektywności
- Lekcja 5 – Magia Wydarzeń: Spraw, by Twoje Strony Ożyły
- Lekcja 4 – Manipulacja DOM: Zamień Internet w Swój Własny Plac Zabaw
- Lekcja 3 – Tablice i Obiekty: Twoje Skarbce Danych
- Lekcja 2 – Pętle i Warunki: Podejmowanie Decyzji i Powtarzanie (Bez Wariacji)