Zásady psaní čistého kódu v JavaScriptu pro začátečníky i pokročilé
Prvním krokem je určit si, které funkce jsou pro vás klíčové. Pokud jste začátečník, potřebujete hlavně zvýraznění syntaxe, jednoduché spouštění kódu a rychlé odhalení chyb. Naopak pokud pracujete na větším projektu, oceníte integrovaný debugger, podporu verzovacích systémů a automatické dokončování kódu. Dejte si pozor na přehnané množství pluginů – každá instalace navíc zvyšuje nároky na výkon a může zpomalit prostředí. Začněte s čistou instalací a přidávejte jen to, co opravdu využijete.
Na závěr: čistý kód je běh na dlouhou trať. Nejdřív to bude vyžadovat vědomé úsilí, ale brzy se z toho stane zvyk. Až příště budete chtít „rychle" něco spáchat a přejmenovat proměnnou na `x`, vzpomeňte si, že číst se to bude mnohokrát častěji než psát. Investice do čitelného kódu se vám vrátí dřív, než čekáte.
Nezapomínejte ani na konzistenci. Zvolte si jeden styl (např. uvozovky, středníky, odsazení) a dodržujte ho v celém projektu. Pomohou vám nástroje jako formátovače, které styl sjednotí automaticky. A když píšete cykly, zkuste raději metody jako `map`, `filter` nebo `forEach` – jsou čitelnější než klasický `for` a častěji vedou k menšímu množství chyb.
Kromě klasických breakpointů se vyplatí znát i breakpointy pro události, které najdete v panelu Event Listener Breakpoints. Můžete tak zastavit běh kódu při kliknutí myši, stisknutí klávesy nebo změně DOM. To je užitečné, když potřebujete zjistit, proč se nějaká interakce nechová podle očekávání. Další užitečnou funkcí je sledování výrazů (Watch). Zde si můžete přidat vlastní výrazy, jejichž hodnota se průběžně aktualizuje. Například když sledujete stav pole nebo délku řetězce, nemusíte ho hledat v panelu Scope pokaždé znovu.
Komentáře používejte střídmě. Dobrý kód se komentuje sám – stačí výstižné názvy. Komentář pište, až když vysvětlujete proč, ne co. Například proč je zvolený tento algoritmus nebo proč se čeká časový limit. Pokud komentář popisuje, co dělá další řádek, je to zbytečnost. Místo toho kód upravte tak, aby byl jasný sám o sobě.
Další praktickou radou je používat interaktivní rebasování k reorganizaci commitů. Pokud máte ve větvi smíšené změny, můžete je rozdělit nebo sloučit, aby byly logické celky. Tím usnadníte pozdější revize a hledání chyb. Vyhněte se ukládání souborů s ladicími výpisy nebo dočasnými komentáři do commitů, protože to znečišťuje historii a ztěžuje orientaci. Místo toho použijte .gitignore pro dočasné soubory a před commitnutím si vždy zkontrolujte diff.
Typickou chybou je psát dlouhé podmínky s mnoha logickými operátory. Místo `if (uzivatel && uzivatel.prava && uzivatel.prava.admin)` si vytvořte pomocnou proměnnou nebo funkci, třeba `jeAdmin(uzivatel)`. Stejně tak se vyhněte hlubokému vnořování – když potřebujete tři úrovně `if` nebo cyklů, zamyslete se, jestli to nejde zjednodušit. Často pomůže včasný návrat: místo jedné velké podmínky s návratem na konci použijte `if (!podminka) return;` hned na začátku.
Častou chybou při ladění je spoléhání se na příkaz console.log. Ten sice funguje, ale za cenu zahlcení konzole a nutnosti ručně kontrolovat každý výstup. Mnohem efektivnější je použít breakpoint a prozkoumat stav aplikace v daném okamžiku. Pokud už musíte použít console.log, využijte jeho varianty: console.table pro pole objektů, console.time pro měření času nebo console.assert pro podmíněné logování. Tím získáte přehlednější výstup a vyhnete se zbytečnému pátraní v obrovském množství textu.
Práce s breakpointy a krokováním kódu Nejefektivnější způsob, jak pochopit, co se v kódu děje, je zastavit jeho běh v přesně určeném místě. Otevřete DevTools (obvykle klávesou F12 nebo přes kontextovou nabídku) a přejděte do záložky Sources. Zde najdete všechny načtené skripty. Kliknutím na číslo řádku nastavíte breakpoint – červená značka označuje místo, kde se běh zastaví. Poté už jen obnovíte stránku a kód se zastaví přesně tam, kde potřebujete. V tuto chvíli můžete najet myší na proměnnou a zobrazit její aktuální hodnotu, nebo použít panel Scope pro sledování všech lokálních i globálních proměnných. Krokování (Step over, Step into, Step out) vám umožní procházet kód řádek po řádku. Dejte si pozor na to, abyste omylem nekrokovali do externích knihoven – to vás jen zdrží. Pomocí pravého tlačítka na breakpointu můžete nastavit podmínku, takže se zastaví pouze tehdy, když je splněna určitá logická podmínka.
Při testování IDE si všímejte, jak rychle se otevře a jak reaguje na psaní. Některá prostředí jsou náročná na paměť, což oceníte na výkonném počítači, ale na starším notebooku vás to bude brzdit. Typická chyba: stáhnete si nejpopulárnější nástroj, ale po pár týdnech zjistíte, že vám nevyhovuje jeho vzhled nebo náročnost konfigurace. Místo toho vyzkoušejte tři nebo čtyři různé možnosti a věnujte každé alespoň jeden den. Pracujte na reálném projektu, ne jen na ukázkové úloze, protože teprve tak odhalíte, co vám nástroj usnadňuje a co naopak komplikuje.