Att skriva läsbar kod: Skillnad mellan sidversioner

Från Webbling
Hoppa till: navigering, sök
Ingen redigeringssammanfattning
Rad 20: Rad 20:
// Allt efter dubbelstrecket är en kommentar, fram till raden är slut.
// Allt efter dubbelstrecket är en kommentar, fram till raden är slut.


tal = 2; // Koden före dubbelstrecket körs, men resten av raden ignoreras
let tal = 2; // Koden före dubbelstrecket körs, men resten av raden ignoreras
/* Kommentarer av denna typ inleds med streck och stjärna och avslutas med; */
/* Kommentarer av denna typ inleds med streck och stjärna och avslutas med; */

Versionen från 30 januari 2019 kl. 14.33

Det är viktigt att skriva läsbar kod som är lätt att underhålla, debugga och förändra. Inte minst är det viktigt för dig själv, men det är även av stor vikt om du jobbar i ett projekt där många ska bidra med kod. I såna fall måste alla skriva mer eller mindre likadan kod, så att alla förstår hur saker fungerar. I dessa fall använder man sig ofta av en så kallad stilguide, som talar om hur kod ska formateras, hur variabler och metoder ska namnges, osv.

Kommentarer

Om din kod ska bli läslig och förståelig är det viktigt att kommentera koden. Detta gäller inte minst om andra ska läsa din programkod. Det som är helt självklart för dig, kanske inte alls är lika självklart för en annan programmerare. Likaså är kommentarer nyttiga att läsa när du återvänder till kod som du skrev för länge sen. Även om det är du själv som skrivit koden, kanske du kommer att glömma hur den fungerar när det gått en längre tid. Att sitta och dechiffrera vad man menade med gammal kod, kan i vissa fall ta lika lång tid som att skriva om den från scratch!

Kommentarerna har ingen betydelse för funktionen av programmet, utan är bara till för oss människor. Du bör kommentera allting som kan tänkas vara svårbegripligt. Tänk på att du kanske ska in och ändra i koden om flera år, då kanske inte det du idag tycker är självklart är lika självklart längre. Likaså kanske en annan programmerare kommer att missförstå din kod och när denne ska ändra i koden så kanske något följdfel smyger sig in.

Det är alltså god vana att alltid kommentera sin kod. När man går igenom exempel under lektioner och skriver kod ”tillsammans” på projektorn kanske det inte finns tid till att kommentera. Men låt inte det hindra dig ifrån att redan från början lägga dig till med den goda vanan att kommentera!

I JavaScript kan man kommentera på två olika vis. Dels har man en kommentartyp som gäller för resten av den rad kommentaren står på och dels en typ där man kan kommentera ett helt block som sträcker sig över flera rader.

  • Radkommentarer inleds med ”//”, resterande text på den raden är en kommentar. Så fort en ny rad inleds tolkas allt som kod igen.
  • Flerraderskommentarer inleds med ”/*” och avslutas med ”*/”. All text inom dessa tecken, kommer att ignoreras av interpretatorn (den som tolkar din kod).

Här följer ett par exempel på olika sätt på vilka man kan kommentera sin kod.

  // Allt efter dubbelstrecket är en kommentar, fram till raden är slut.

 let tal = 2; // Koden före dubbelstrecket körs, men resten av raden ignoreras
	
  /* Kommentarer av denna typ inleds med streck och stjärna och avslutas med; */ 

  /* Den här typen av kommentarer kan
     sträcka sig över
     många rader
     och slutar inte tills */

Observera att man inte kan nästla flera flerraderskommentarer inuti varandra. Den första ”*/” som JavaScript påträffar kommer att få interpretatorn att gå ur kommentarsläget och börja tolka texten som kod igen. Följande kommer alltså inte att fungera:

	/* Man kan inte nästla flerraderskommentarer
	/* Efter slutet på dessa tecken förväntar C# att det kommer kod igen →*/
	    Här är det fel, för här ska egentligen kod börja */

Blankrader, tabbar och mellanslag

Hur man formaterar koden man skriver har egentligen ingen större betydelse för JavaScript. Däremot är det ett viktigt verktyg för att skapa läsbar kod. Precis som i fallet med kommentarer kan vettig formatering hjälpa dig själv och andra att lättare läsa och förstå din kod. De flesta moderna utvecklingsverktyg hjälper dig med att formatera din kod på ett vettigt vis.

Det viktigaste man ska göra är att indentera sin kod. Indentera är svengelska för att göra indrag i marginalen, d.v.s. att börja skriva en bit in på raden. Man formaterar sin kod med hjälp av mellanslag eller tabbar. Detta hjälper till så att det går att se strukturen på programmet. Främst gäller detta när man skapar kodblock med hjälp av "{" och"}". Ett exempel på det kan vi se i följande kodsnutt:

function Spawner ()
{
   for (let i=0; i <= Score.score / 10; i++) {
      Instantiate( monster );
   }
		
   if (Life.life > 0) {
      time = 10;
   } else {
      time = 0.1f;
   }
}

Även om vi kanske inte förstår vad koden gör, kan vi lätt se hur olika satser hör samman i kodblocken tack vare att de är indragna/indenterade. Detta gör att koden blir mer lättöverskådlig och att man snabbt kan se strukturen och förstå hur de olika delarna hänger samman.

Lägg även märke till att kodexemplet använder sig av blankrader för att ytterligare visa kodstrukturen. De kodbitar som har med varandra att göra ligger bredvid varandra, medan de satser som gör olika saker åtskiljs med en tomrad. Man kan jämföra hur man i vanlig text använder sig av styckesindelning. Varje stycke handlar om en specifik sak och när man ska tala om något annat gör man ett nytt stycke. Precis så fungerar blankraderna när man formaterar sin kod. Återigen så har detta ingen betydelse för programmets funktionalitet, det är bara ett sätt att göra din kod mer lättläslig.

Man skulle lika gärna kunna skrivit ovanstående som en enda lång rad, så som du ser här under. Vilket tycker du är mest lättläst och lättförståeligt?

function Spawner(){for(let i=0;i<=Score.score/10;i++){Instantiate(monster);}if(Life.life>0){time=10;}else{time=0.1f;}}

Nästa aktivtet

Olika typer av fel som kan uppstå