Starý JavaScript často vzniká vrstvením oprav. Funkce se zvětšují, proměnné se jmenují data, temp nebo x, a logika se větví přes tři úrovně vnořených podmínek. Když se pak k takovému kódu vrátíte po půl roce, strávíte hodiny jen tím, abyste pochopili, co vlastně dělá. Refaktoring není o přepisování od nuly. Je to řízený proces, při kterém měníte strukturu, ale zachováváte chování.

Začněte tím, že si před refaktoringem vytvoříte testy. Nemusí být dokonalé, stačí pokrýt hlavní vstupy a výstupy. Bez nich riskujete, že při čištění kódu zanesete chybu, o které se dozvíte až v produkci. Poté se zaměřte na jednu funkci denně. Vytáhněte z ní skryté podmínky do pojmenovaných pomocných funkcí. Nahraďte magické konstanty konstantami pojmenovanými. Pokud narazíte na příliš dlouhou funkci, rozdělte ji podle toho, co dělá, ne podle toho, kolik má řádků. Užitečné zásady pro takovou práci najdete v článku o tom, jak psát čistý kód v JavaScriptu, který se věnuje i pojmenovávání a struktuře modulů.

Častým problémem je funkcionální chaos: mix callbacků, Promise a async/await v jedné funkci. Sjednoťte styl na jednom místě. Pokud používáte async/await, držte se ho i v okolních funkcích. Callbacky předávejte jen tam, kde to vyžaduje starší API. Dále odstraňte sdílený stav, který se mění na více místech. Nahraďte ho parametry a návratovými hodnotami. Když funkce dostane vše potřebné přes argumenty a vrací novou hodnotu, přestává být závislá na okolním kontextu a je mnohem snazší ji testovat.

Nakonec refaktorujte po malých krocích a po každé změně spusťte testy i aplikaci. Velké přepisy najednou obvykle skončí tak, že se vrátíte k původní verzi. Pokud je kód opravdu špatný, zvažte postupný přesun do samostatného modulu. Nový modul napište čistě, otestujte a teprve potom odstraňte starou implementaci. Čitelný kód nevzniká z inspirace, ale z opakovaných malých rozhodnutí.