Jullie hebben nu geruime tijd leren programmeren. De losse stukken code zijn best okay. Maar de programma’s als geheel doen mij werkelijk pijn in de buik krijgen.
Voorbeeld Code
https://editor.p5js.org/EloqArch/full/bsYNwscEF
Bedankt, dearflamingo1 en tautchile1.
Symptomen
Waaraan zie ik 1,2,3 dat er matige code is:
- Het hoofdprogramma draw() bestaat uit honderden regels losse instructies. Elke vertex() heeft ook harde coördinaten mee, geen parameters.
- Dezelfde instructies komen terug, met telkens andere parameters
Issues
De problemen die dit soort code vroeg of laat oplevert:
- niet te updaten. Als je een update moet doen, moet je al die 7 kopieën van elke ster aanpakken.
- niet te hergebruiken. Wil je de ster laten bewegen, moet je weer opnieuw beginnen.
- als je teveel code op dit niveau hebt, kun je op n gegeven moment je hele project weg donderen want niet te doen. Om verder te komen moet je wel functies gaan gebruiken.
- Je code is gevoelig voor errors. Een foutje is gauw gemaakt, moeilijk te vinden en lastig op te lossen.
Hoe ruim je je draw() op?
Kijk deze video helemaal
https://www.youtube.com/watch?v=4OJpqdzb0J8
Opdracht 1: rework je robot
Gebruik nu je code uit je project “robot”. Heel oud werk. Of pak dit voorbeeld. Ruim de draw() op, zodanig dat er alleen calls in staan naar eigen functions. De coördinaten, indien “hard-coded” mag je laten staan. Dus:
function mijnRobot() {
// hier al je shizzle
}Opdracht 2: parameteriseer je robot
In zijn 2e video legt de guru uit hoe je parameters toevoegt aan je eigen functie. Kijk deze helemaal. Het laatste stukje is handig als je translate() al hebt gehad.
Maak nu een nieuwe versie van je project met weer mijnRobot() maar nu gebruik je parameters voor de positie, hoofdkleur, steunkleur en nog een variabele die je ergens voor gaat gebruiken (nek-lengte, strokeWeight, verzin zelf dan).
Opdracht 3: werken met return waardes
In de derde video legt Prof Cris uit hoe je de return waarde van een functie kunt gebruiken.
Vraag: wat heb je nodig als je een functie gebruikt die een return-waarde oplevert? Zoals bijv. de random() function?
Opdracht 4: kmToMiles()
Kijk nu deze video van de coding train.
Leuke functie gemaakt dude, maar ja, de verkeerde kant op.
Als opdracht maak jij dezelfde functie als hij, maar de andere kant op: kmToMiles(). Gebruik deze in zeker 3 voorbeeld calls. Zorg ervoor dat je de waarde opslaat en logt naar console.
Eindopdracht Functies
Rework je paint of je light switch game (naar keuze) zodanig dat:
- de draw() gebruik maakt van minstens 3 eigen functies
- waarvan minstens 1 een return value
- er maximaal 25 regels code overblijven in je draw()
- Te makkelijk: ga naar de opdrachten over objecten en maak een o.o. versie van 1 van de 2 projecten.
