Clean Code JavaScript concepts - TristanVarewijck/Block-Tech GitHub Wiki

Het maakt de computer niet uit hoe je code is geschreven als het maar werkt. Maar mensen die geïnteresseerd zijn in jouw code, omdat je er samen aan werkt of het is Open Source moeten het ook kunnen lezen. Hier kunnen we voor zorgen door het schrijven van

'Clean code JavaScript'

In dit document zal ik meerdere onderwerpen aan kaarten over hoe je 'clean code' kan schrijven en zal ik een aantal voorbeelden laten zien. Er zijn natuurlijk meer manieren maar dit zijn de manieren die ik begrijp en heb toegepast. De voorbeelden komen uit mijn eigen code.

Variables

De namen van variables zijn heel belangrijk. Het moeten namelijk duidelijke en leesbare variables zijn.

Not to do:

To do:

Jij weet misschien wat const fB betekent maar buitenstaanders kunnen dit niet weten.

Linting

Doormiddel van Linters kan je onenigheden uit je code verwijderen zoals: spaces, of '' in plaats van "" maar ook het goed gebruik van const en let. Het zijn dingen die je code toch beter en logischer maken.

Before:

After:

Formatting

Door je code te 'formatten' zorg je er eigenlijk voor dat je code netjes word gemaakt, doordat spaces tussen stukken code worden gefixed na het formatten is je code beter geordend en beter leesbaar.

Before:

After:

Comments

Om je code goed over te brengen is het belangrijk dat je op tijd inspringt met 'comments'. Comments maken het veel makkelijker om stukken code te begrijpen. Een comment hoeft niet lang te zijn als het maar duidelijk maakt waar het stuk code over gaat en wat het dient.

Not to do:

To do:

Avoid positional markers

Een aanvulling voor het toevoegen van comments is dat je ze niet gebruikt om secties in je code te maken 1 regel is genoeg om het begrijpbaar te maken. Als je, je code 'clean' houd is het al begrijpbaar, je hoeft je comments niet uitgebreid of heel opvallend te maken!

Not to do:

To do:

Function names should say what they do

Aangezien een functie iets in gang zet is het belangrijk om de functie-naam dit te laten omschrijven, zo krijg je een idee van wat de function doet en is het minder moeilijk te begrijpen.

Not to do:

To do:

Resource