Moje první JavaScriptové projekty
Moje první JavaScriptové projekty: Kámen Nůžky Papír & Kalkulačka
Prosinec 2025
Když jsem začal učit JavaScript, rozhodl jsem se postavit dva jednoduché projekty na pochopení základů. Tady je, co jsem se naučil z konzolovky Kámen Nůžky Papír a interaktivní kalkulačky.
Projekt 1: Kámen Nůžky Papír
První projekt byla klasická hra. Běží v konzoli a hraje 5 kol proti počítači.
Náhodná čísla
Musel jsem naučit počítač náhodně si vybrat mezi kamenem, nůžkami a papírem. Použil jsem Math.random() a Math.floor():
function getComputerChoice() {
let randomNum = Math.floor(Math.random() * 3);
if (randomNum === 0) return "rock";
else if (randomNum === 1) return "paper";
else return "scissors";
}Validace vstupu
Důležité bylo ujistit se, že hráč zadá platnou volbu. Pokud napíše něco jiného, funkce se rekurzivně zavolá znovu.
Herní logika
Musel jsem vymyslet všechny výherní podmínky. Kámen poráží nůžky, nůžky papír, papír kámen. Použil jsem globální proměnné na sledování skóre napříč koly.
Projekt 2: Interaktivní kalkulačka
Druhý projekt byla webová kalkulačka s GUI. Na rozdíl od konzolovky tohle vyžadovalo práci s DOMem a propojení JavaScriptu s HTML.
DOM manipulace
Naučil jsem se přistupovat k HTML elementům a měnit jejich hodnoty pomocí document.getElementById().
Parsování řetězců
Kalkulačka ukládá vstup jako řetězec a pak ho parsuje. Použil jsem smyčku na nalezení pozice operátoru a substring() na rozdělení výrazu na dvě čísla.
Funkce kalkulačky
Tři hlavní funkce:
- pis(): Přidává čísla a operátory na displej
- rovnase(): Parsuje výraz, rozdělí ho na čísla a operátor, vypočítá výsledek
- smaz(): Vyčistí displej zpět na 0
Konverze typů
Musel jsem pochopit převádění mezi řetězci a čísly pomocí Number(). Displej ukládá všechno jako text, ale výpočty potřebují čísla.
Co jsem se naučil
Logické myšlení: Programování vyžaduje promyšlení všech možných scénářů.
Debugging: Zvykl jsem si používat console.log() na testování a hledání bugů.
Zpracování vstupu: Naučil jsem se, jak důležité je validovat a správně zpracovávat uživatelská data.
Konzole vs webové aplikace: První projekt běžel v konzoli s prompt() a console.log(). Druhý měl GUI a vyžadoval DOM manipulaci.
Co dál
Tyto projekty jsou jen začátek. Budoucí vylepšení:
- Přidat podporu pro více operátorů v kalkulačce
- Vytvořit GUI pro Kámen Nůžky Papír s tlačítky místo promptů
- Naučit se moderní JavaScript features jako arrow funkce
- Prozkoumat frameworky jako React
Pokud teprve začínáš s programováním, doporučuju postavit podobné projekty. Jsou skvělé na procvičování základů a zároveň vytvoříš něco funkčního.
Investovaný čas: asi 15 hodin
Díky za přečtení! Pokud máš otázky nebo návrhy na vylepšení mého kódu, budu rád za feedback.