Dve medzery na odsadzovanie v JS

Keď som bol mladý a sprostý, tak som svoj kód odsadzoval o dve medzery a nepoužíval prázdne riadky v tele funkcií, lebo sa mi páčilo ako je kód na husto. Mal som pocit, že produkovaním veľkých stien textu môj kód vyzerá veľmi hackersky. Zdalo sa mi, že to musí robiť dojem, lebo na prvý pohľad to vyzerá nezrozumiteľne, ale pritom ja(!) sa v tom dokážem vyznať.

Veľmi skoro som zistil, že v programovaní sa skôr cení prehľadnosť a udržateľnosť kódu. Je veľmi dôležité správne pomenovanie, jednotná a prehľadná formálna úprava kódu. Všetky tieto veci znižujú kognitívny load na náš mozog v čase, keď kód potrebujeme čítať.

V odsadzovaní som preto prešiel na používanie štyroch medzier, ktoré sa nakoniec stali v PHP svete štandardom. Kým sme v PHP viedli sväté vojny za 4 medzery namiesto tabov, tak z môjho pohľadu sa v JavaScripte viedla tichá vojna dvoch proti štyrom medzerám. A k môjmu prekvapeniu sa zdá, že vyhrali dve medzery.

Nerozumiem tomu, lebo mne sa zdá, že dve medzery prinášajú neprehľadnosť a veľmi ťažko sa odhaduje, o koľko úrovní je vlastne riadok odsadený, špeciálne, ak ho porovnávam s nejakým iným. V JavaScripte sa mi to zdá o to dôležitejšie, lebo je to jazyk, kde sa veľmi používajú callbacky a kód sa tak celkom rád ťahá doprava.

Akurát, že zástancovia dvoch medzier používajú presne tento argument na obhájenie svojej pozície. "JavaScriptový kód sa zvykne ťahať doprava, tak potrebujeme dve medzery, aby sme to kompenzovali". 🙃

Ja si naopak myslím, že ak sa mi kód ťahá doprava, tak ho mám asi zle naprogramovaný a príliš veci vnáram. Zrejme niekde porušujem aj Single Responsibility princíp a mal by som ten kód upratať.

Dve medzery mi tak maskujú problémy v kóde. Avšak ja nechcem, aby mi vizuálna úprava zakrývala chyby návrhu. Ja chcem, aby na mňa kód vizuálne kričal: "haló, haló, tu je niečo zle, som veľmi napravo, treba ma prepísať".

Preto ja ostanem pri používaní štyroch medzier aj v JavaScripte a vo svojich projektoch som si upravil aj konfiguráciu pre ESlint a Prettier.

Takto som si to zapísal do .prettierrc

{
    "tabWidth": 4
}

A takto do .eslintrc.js

module.exports = {
    // ...
    rules: {
        indent: ["error", 4],
    },
};