Ćwiczenia – JavaScript (Poziom 1)

Zestaw zadań dla początkujących: zmienne, warunki, pętle, tablice, tekst i liczby – świetny start przed dalszą nauką JS.

Postęp: 0/10 zadań XP: 0
🎯 Cel: ogarnąć podstawy JS 💡 Najpierw spróbuj sam, potem sprawdź kod

Ćwiczenie 1: Deklarowanie zmiennych i stałych

Poziom: łatwe • Temat: zmienne

Zmiennych i stałych używasz w każdym programie – przechowują dane, którymi później operujesz.

Zadeklaruj zmienną x i przypisz jej wartość 10. Następnie zadeklaruj stałą PI, której wartość wynosi 3.14. Wyświetl obie wartości w konsoli.

let x = 10;
const PI = 3.14;
console.log(x);
console.log(PI);

Ćwiczenie 2: Uchwycenie elementu HTML

Poziom: łatwe • Temat: DOM

Łącząc JS z HTML, możesz reagować na kliknięcia i zmieniać treść strony bez przeładowania.

Użyj JavaScript, aby uchwycić element o ID myButton i przypisać do niego funkcję, która po kliknięciu zmieni tekst w elemencie o ID result na „Dziękuję za kliknięcie”.

<button id="myButton">Kliknij mnie</button>
<p id="result"></p>

<script>
let button = document.getElementById('myButton');
let result = document.getElementById('result');

button.addEventListener('click', function() {
    result.textContent = 'Dziękuję za kliknięcie';
});
</script>

Ćwiczenie 3: Instrukcja if i logika

Poziom: łatwe • Temat: warunki

Warunki sterują logiką aplikacji: „jeśli to, zrób tamto”. Przydadzą się w walidacji formularzy, grach itd.

Sprawdź, czy liczba wprowadzona przez użytkownika jest większa od 10 oraz czy jest liczbą parzystą. Jeśli oba warunki są prawdziwe, wyświetl odpowiednią wiadomość w konsoli.

let number = prompt("Podaj liczbę:");

if (number > 10 && number % 2 === 0) {
    console.log("Liczba jest większa od 10 i parzysta.");
} else {
    console.log("Warunki nie zostały spełnione.");
}

Ćwiczenie 4: Pętla for

Poziom: łatwe • Temat: pętle

Pętle pozwalają powtarzać czynność wiele razy, np. przejść po tablicy wyników.

Wypisz liczby od 1 do 10 w konsoli.

for (let i = 1; i <= 10; i++) {
    console.log(i);
}

Ćwiczenie 5: Funkcja z parametrami

Poziom: łatwe • Temat: funkcje

Funkcje to „klocki” logiki – raz napisane możesz wywoływać wiele razy z różnymi danymi.

Napisz funkcję suma(a, b), która zwróci sumę dwóch liczb. Następnie wywołaj tę funkcję i wyświetl wynik w konsoli.

function suma(a, b) {
    return a + b;
}

console.log(suma(5, 7)); // Wynik: 12

Ćwiczenie 6: Parsowanie liczb

Poziom: łatwe • Temat: liczby

Dane od użytkownika przychodzą jako tekst – trzeba je zamienić na liczby, żeby liczyć.

Poproś użytkownika o podanie liczby w formie tekstu, przekonwertuj ją na liczbę całkowitą i wyświetl wynik w konsoli.

let number = prompt("Podaj liczbę:");
let parsedNumber = parseInt(number);
console.log(parsedNumber);

Ćwiczenie 7: Instrukcja switch

Poziom: łatwe • Temat: wybór

switch przydaje się, gdy masz kilka możliwych wariantów (np. różne dni tygodnia).

Sprawdź, czy dany dzień tygodnia to „poniedziałek”, „wtorek” lub inny dzień, a wynik wyświetl w konsoli.

let day = prompt("Podaj dzień tygodnia:");

switch (day.toLowerCase()) {
    case 'poniedziałek':
        console.log("Dzisiaj poniedziałek!");
        break;
    case 'wtorek':
        console.log("Dzisiaj wtorek!");
        break;
    default:
        console.log("Dzień nie jest poniedziałkiem ani wtorkiem.");
}

Ćwiczenie 8: Tablica w JavaScript

Poziom: łatwe • Temat: tablice

Tablice przechowują listy elementów, np. wyniki uczniów, listę zadań czy nazwy przedmiotów.

Utwórz tablicę z 5 liczbami, a następnie wypisz je w konsoli.

let numbers = [1, 2, 3, 4, 5];
console.log(numbers);

Ćwiczenie 9: Przetwarzanie łańcuchów

Poziom: łatwe • Temat: tekst

Operacje na tekście przydadzą się np. przy formatowaniu nazw użytkowników czy wiadomości.

Zamień wszystkie litery w podanym tekście na wielkie.

let text = prompt("Podaj tekst:");
console.log(text.toUpperCase());

Ćwiczenie 10: Obiekt Math

Poziom: łatwe • Temat: Math

Obiekt Math daje gotowe funkcje matematyczne, np. pierwiastki, zaokrąglanie czy losowanie.

Oblicz pierwiastek kwadratowy z liczby 16 oraz zaokrąglij liczbę 3.7 do najbliższej liczby całkowitej.

let squareRoot = Math.sqrt(16);
let rounded = Math.round(3.7);

console.log(squareRoot);  // Wynik: 4
console.log(rounded);     // Wynik: 4