Like feature 2 (funktioner)
Hvis du ønsker at brugeren skal kunne like mere end ét billede, har du hver gang behov for i hver hændelsesprocedure at gentage den kodesekvens du opbyggede i den foregående lektion. Derfor vil det være en god ting at kunne genbruge de syv linjer kode, og det er netop hvad du kan ved hjælp af funktioner. Det gør samtidig koden lettere at vedligeholde, når den kun står ét sted.
​
1. Opret et billede mere, som din bruger kan like. Kald pladsholderen til det nye like-ikon "image2Like" for at følge en systematisk navngivning.
2. Opret en funktion ved at trække den øverste blok i kategorien Functions over mellem Linje 12 og Linje 13 .
3. Navngiv funktionen "likeFunction" i Linje 13 . Træk hele if-blokken fra Linje 17 - 23 op i funktionens Linje 14 .
4. Træk et funktionskald ind i hændelsesproceduren og navngiv det "likeFunction" for at kalde funktionen med den kode du nu kan genbruge. Test at din like-feature stadig virker.
Funktionsparametre
Før du kan kalde funktionen fra dine andre likeknappers hændelsesprocedurer, skal koden ændres, så den peger på det nye hjerte og ikke på "image1Like" hver gang. For at opnå dette udnytter vi, at funktionen kan have en såkaldt parameter, en variabel som får en værdi, bliver initialiseret, i funktionskaldet.
​
5. Klik på den lille højrepil (Trin 1) for at definere en parameter i din funktionserklæring. Nu dukker der en inputboks op i parentesen, hvor du kan skrive et parameternavn. Skriv likeID (Trin 2). Da det er en variabel, skal der ikke være anførselstegn omkring.
6. Værdien, som denne funktionsparameter kommer med hver gang funktionen bliver kaldt, skal indsættes alle de steder i funktionens kode, hvor der nu står "image1Like". Erstat derfor de fem steder med parameternavnet likeID.
7. Herefter skal funktionskaldet ændres, så det leverer den rigtige parameterværdi til funktionen, når det kalder den. Klik på den lille højrepil i funktionskaldet (Trin 1) og skriv i anførselstegn "image1Like" (Trin 2).
8. Nu kan du lave alle de like-knapper du ønsker, hvor parameterværdien hver gang skal være element-ID'et for det element (hjerte) brugeren klikker på. Her vises koden for hændelsesproceduren for det nederste hjerte i Linje 25 - 27 . , hvor parameterværdien skal være "image2Like" i stedet for "image1Like".
Test at det virker.
