Kmom06: Modul och closure

By . Latest revision .

När kodbasen växer blir det mer och mer viktigt att ha en bra struktur på den, annars blir det svårare och svårare att vidareutveckla och underhålla koden. När man dessutom skall använda olika moduler av kod från olika tillverkare så är det viktigt att de olika delarna av koden inte krockar. Genom att använda en konstruktion som kallas module pattern hittar vi ett sätt att bättre strukturera vår kod.

En SVG-bild till ett hänga gubben-spel som byggs enligt module pattern.

En SVG-bild till ett hänga gubben-spel som byggs enligt module pattern.

(Detta är instruktionen för kursmomentet och omfattar det som skall göras inom ramen för kursmomentet. Momentet omfattar cirka 20 studietimmar inklusive läsning, arbete med övningar och uppgifter, felsökning, problemlösning, redovisning och eftertanke. Läs igenom hela kursmomentet innan du börjar jobba. Om möjligt – planera och prioritera var du vill lägga tiden.)

#Läsanvisningar

(ca: 4-6 studietimmar)

#Kurslitteratur

Läs följande.

  1. Läs i boken Learning JavaScript Design Patterns för att ta reda på vad ett module pattern är.

#MDN

Läs följande:

  1. Läs i MDN JavaScript Guide för att studera begreppet closure.

#Video

Titta på följande:

  1. Videoserien Lär dig JavaScript är tätt kopplat till kursmaterialet. Kika igenom serien under kursens gång.

  2. Se Douglas Crockford på konferensen HTML5DevConf 2011 när han pratar om “JavaScript Programming Style and Your Brain”. Video riktar sig till mer erfarna programmerare men även nybörjare har nytta av den.

#Övningar & Uppgifter

(ca: 12-16 studietimmar)

#Övningar

Genomför övningarna för att träna inför uppgifterna.

  1. Jobba igenom övningen om “Funktioner, scope, closures och moduler med JavaScript”. Det är ingen kod du måste skriva, men du borde provköra varje exempel i din egen miljö. Det hjälper dig att öva in begreppen och du kan själv modifiera testprogrammen för att test hur de fungerar.

#Uppgifter

Dessa uppgifter skall utföras och redovisas.

  1. Gör uppgiften “Hänga gubben som modul i JavaScript”. Spara koden i me/kmom06/hangman.

#Resultat & Redovisning

(ca: 1-2 studietimmar)

Läs instruktionen om hur du skall redovisa.

Se till att följande frågor besvaras i redovisningstexten.

  • Var det svårt att greppa hur function scope och closure fungerar eller känns det naturligt?
  • Har du några erfarenheter av designmönster sedan tidigare?
  • Kan du jämföra “module pattern” med någon annan liknande datastruktur?
  • Känns “module pattern som en bra kodstruktur”?
  • Var boken “Learning JavaScript Design Patterns” lättläst eller utmanande?

#Revision history

  • 2017-10-10: (D, mos) Genomgång inför ht17.
  • 2016-03-15: (C, mos) Lade till videoserie med “Lär dig JavaScript”.
  • 2015-01-19: (B, mos) Bort ruta om kursutveckling och bort länk till youtube-serie.
  • 2014-10-30: (A, mos) Första utgåvan för javascript1 kursen.

Document source.