Foto af rawpixel.com på Unsplash

Sådan undgår man almindelige begyndere-faldgruber og begynder at kode som en professionel

Det er svært at lære at kode. Vi har alle stødt på kryptiske fejl og kodebrydelse uden nogen åbenbar grund. Desværre er denne oplevelse en del af at lære at kode. Der er et par skridt, du kan tage for at forbedre din kodekvalitet og forhindre almindelige fejl.

Undgå at kopiere indsættelseskode

Meget af den læring, du vil gøre som nybegynder, kommer fra gentagelse. Det er ikke ligefrem glamorøst, men når du har skrevet en for loop for 100. gang, gør du det næsten uden at tænke over.

Du vil ofte blive fristet til at kopiere og indsætte kode for at spare dig selv besværet med at skrive det ud. Du bør undgå det for enhver pris. Der kan være en subtil forskel mellem koden, du vil skrive, og hvad du kopierer. Dette kan introducere en subtil bug, der kan være vanskelig at spore.

Når du kopierer kode, omgås du den kognitive proces fuldstændigt.

Sørg for, at du forstår koden, du skriver så meget som du kan. Når du kopierer kode, omgås du den kognitive proces fuldstændigt. Selv hvis den kode, du kopierede fungerer, som det var beregnet, har du ikke lært meget af at indsætte den. Hver gang du indtaster din kode fuldt ud, bliver du så meget mere fortrolig og komfortabel med den.

Fornuftige navne

Der er kun to hårde ting i Computer Science: cache-ugyldighed og navngivning af ting.
- Phil Karlton

Brug navneord til variabel- og egenskabsnavne. Gør dem så beskrivende som muligt.

Brug altid fulde ord og undgå forkortelser. Forskellige mennesker kan fortolke forkortelser på forskellige måder. Dette kan gøre det vanskeligere at forstå, hvad koden gør. For eksempel kan intlSize betyde enten international størrelse eller intern størrelse. Den vigtige ledetråd i et navn går tabt på grund af forkortelsen.

Når du refererer til den samme ting på tværs af din kodebase, skal du bruge det samme navn. Undgå for eksempel at henvise til doorColour som farveOfDoor eller doorColor andre steder. Dette vil spare dig for fejl forårsaget af brug af forkerte variabelnavne. Konsistensen sparer dig også tid til at finde det nøjagtige variabelnavn hver gang.

Undgå generiske, ikke-beskrivende navne som data eller proces. De kan betyde noget og give ikke meget information om deres formål.

Konsekvent indrykkelse

Konsekvent indrykkelse af kode gør det lettere at se potentielle fejl. Dette er, hvad professionelle udviklere gør uden at tænke. Meget få af dem taler om det, fordi det er så indlysende for dem. Ikke desto mindre understreger få tutorials vigtigheden af ​​at bruge konsekvent indrykkning.

I eksemplerne nedenfor indrykker vi ved hjælp af faner, men mellemrum er dog også acceptabelt. Nøglen er at vælge den, du vil bruge, og anvende den konsekvent. Bland ikke faner og mellemrum i din kode.

Så hvordan ser korrekt indrykket ud? Hver gang du indsætter et HMTL-tag i et andet, skal du tilføje en ny linje og fane foran det nye tag til indrykket. Når du lukker et HTML-tag, skal du tilføje en ny linje og fjerne en fane fra dit indrykk.

Her er det indre tag img-mærket. Se, hvordan det er indrykket en fane? Bemærk også, hvordan den venstre kant af det lukkende div-tag stiger op med venstre kant af dets åbningskode.

Denne tilgang bliver super vigtig, når du har hundreder af tags på en side. Hvis du har fulgt processen korrekt, skal din endelige lukningskode skylle med venstre side af din side. Dette gør det nemt at kontrollere, om koden er korrekt.

Lad os se, hvordan vi kan bruge indrykning til at se manglende tags.

Se, hvordan i eksemplet ovenfor lukker div-mærket på linje 14 ikke på linje med det åbne div-tag på linje 1? Det er en anelse om, at noget mangler. I dette tilfælde gik vi glip af det lukkende ul-tag. Når vi har tilføjet det, falder lukningen på linje med dens åbningspartner

En lignende metode skal anvendes, når du skriver JavaScript. Vi har ikke tags i JavaScript, men vi har "seler" eller "krøllede parenteser". De ser sådan ud {}. Hver åbningsstive skal have en matchende lukkehøjde. De bruges til at betegne kodeblokke. Hver åbningsstag skal følges af en ny linje og en fane til indrykket af indholdet. Lukkehåndtaget skal stille op på venstre side med venstre side af linjen for dets tilsvarende åbningsstag.

Se hvordan stag på linje 11 er på linje med venstre side af linje 1, hvor dens åbningsstag er. Tilsvarende justeres linje 4 med linje 8 og linje 5 justeres med linje 7.

Når korrekt anvendelse, skal indrykkning give din kode en ren, pyramide-lignende struktur. Dette vil gøre det meget nemmere at se, hvor hver blok af kode slutter og begynder. Desuden vil manglende seler nu være meget lettere at se, end hvis de var spredt over hele siden.

Vær opmærksom på syntaksbelysning

En moderne teksteditor, såsom Sublime eller Visual Studio Code, vil fremhæve din kode.

Se hvordan seler, tagnavn, attributnavn og attributværdi er fremhævet med den samme farve?

Se nu koden nedenfor.

Se, hvordan den pæne, konsistente fremhævning pludselig er skiftet? Orange tekst, der bruges til at betegne attributværdi, er spildt over de næste par linjer. Det er en massiv anelse om, at noget er gået galt i vores kode. I dette eksempel skyldes det, at vi har gået glip af de afsluttende citatmærker på hrefattribute-værdien. At opdage en sådan fejl uden markering af kode ville være meget vanskeligt og tidskrævende.

Udviklere kan let spilde dage med at prøve at jage en subtil fejl som den. Vær opmærksom på kodemærkning for at hjælpe dig med at opdage fejl som denne.

Succes vil tage sig af sig selv

At være en god udvikler er summen af ​​opmærksomhed på detaljer og dusinvis af vaner.

Ved at være opmærksom på små ting som indrykkelse, vil du udvikle en forståelse for struktur og omfang. At tænke omhyggeligt over funktion- og variabelnavne hjælper dig med at forstå deres formål og hvordan du bedst opnår det. Syntaksmarkering hjælper dig med at få øje på og rette en skrivefejl, inden den bliver en fejl. Skrivning af al kode ud fuldt ud er det første skridt til at udvikle fortrolighed med syntaks, hvilket igen vil føre til forståelse af, hvordan kode opfører sig.

Alle disse små detaljer, som i første omgang virker ubetydelige, vil med praksis danne grundlaget for din ekspertise. Vær opmærksom på at få disse detaljer rigtige, og succes vil tage sig af sig selv.

Dmitri Grabov er grundlæggeren af ​​Constructor Labs, der driver en 12-ugers JavaScript-webudviklings bootcamp i London. Næste klasse starter den 29. maj og gebyrer er £ 3.000. Ansøgninger er åbne nu, og pladser tildeles efter først til mølle-basis.