Zestaw zadań dla początkujących: zmienne, warunki, pętle, tablice, tekst i liczby – świetny start przed dalszą nauką JS.
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);
Łą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>
if i logikaWarunki 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.");
}
forPę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);
}
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
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);
switchswitch 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.");
}
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);
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());
MathObiekt 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