MBO-SD : De site voor software developer in het MBO
Functies in JavaScript
Wat is een functie
Een functie maak je als je code hebt die je vaker dan 1 keer uit wilt voeren. In een functie zit vaak bepaalde logica, of algoritme om iets te controleren. Bijvoorbeeld als je van meerdere spelers wilt weten of zij ouder zijn dan 18 jaar. Dan wil je niet meerdere keren dezelfde code gebruiken.
//First we declare a changable variable for the age
let playerAge; //variable with no value.
//Function to check if player is of age
function isOldEnough() {
let oldEnough = false;
if (playerAge >= 18) {
oldEnough = true;
}
console.log(oldEnough);
}
playerAge = 17; //Age of player
isOldEnough(); //Call the function
//In the developers console you will now see false
playerAge = 20;
isOldEnough(); //Call the same function again
//In the developers console you will now see true
Functies met parameters/ argumenten
In bovenstaande voorbeeld maken we eerst de playerAge aan en dan roepen we de functie aan waarin die
variabele weer gebruikt wordt. Maar soms is het niet zo makkelijk, bijvoorbeeld omdat er twee spelers zijn
en elke heeft een eigen variabele. (const agePlayerOne
en const agePlayerTwo
.
In dat geval kan ik bovenstaande functie niet meer gebruiken, er is namelijk niet 1 generieke playerAge variabele die in de functie gebruikt wordt. In zo een geval roepen we een functie aan met een argument, het argument, of argumenten (het kunnen er meer dan 1 zijn).
//Two players with an age
const agePlayerOne = 17;
const agePlayerTwo = 20;
//Function to check if player is of age
function isOldEnough(playerAge) {
let oldEnough = false;
if (playerAge >= 18) {
oldEnough = true;
}
console.log(oldEnough);
}
isOldEnough(agePlayerOne); //Call the function
//In the developers console you will now see false
isOldEnough(agePlayerTwo); //Call the function
//In the developers console you will now see true
Parameters
We hebben nu de methode (function) iets aangepast, tussen de ronde haken staat nu een variabeleage
. Deze variabele werkt alleen in de functie. We noemen dit een parameter van de methode.
Methodes (functions) kunnen dus parameters hebben.
Parameters zijn variabelen die alleen in de functie te gebruiken zijn. In bovenstaand voorbeeld is
age
de parameter van de functie.
Argumenten
Bij het aanroepen van de methode (function) moet je deze parameters ook meegeven. Het meegeven van een parameter bij het aanroepen van een methode noem je argumenten.
Argumenten heb je nodig bij het aanroepen van methodes (functions).
In bovenstaand voorbeeld zijn agePlayerOne
en daarna agePlayerTwo
de argumenten
bij het aanroepen van de methode (function) van isOldEnough
Do not repeat yourself (DRY)
Functies passen goed bij de methodiek om DRY te coderen, do not repeat yourself. Op het moment dat je een bepaalde delen van je code (bijna) hetzelfde schrijft. We willen code zo schoon en kort mogelijk houden.
Return waarde
Soms wil je dat een methode iets berekend, bekijkt of doorgeeft. Een methode kan ook een waarde teruggeven. Bovenstaande methode geeft in een console.log true of false, maar vaak zal je de waarde nodig hebben in verdere code.
//Two players with an age
const agePlayerOne = 17;
const agePlayerTwo = 20;
//Function to check if player is of age
function isOldEnough(playerAge) {
let oldEnough = false;
if (playerAge >= 18) {
oldEnough = true;
}
return oldEnough; //We return true OR false
}
const playerOneIsOldEnough = isOldEnough(agePlayerOne); //false
const playerTwoIsOldEnough = isOldEnough(agePlayerTwo); //true
Jouw JavaScript
Op de MBO-SD Fiddle site kan je meer oefenen met deze stof.
Klik hier voor de MBO-SD Fiddle site