Objecten - Functies en het this-attribute

Functies in objecten

Een object kan in tegenstelling tot een array ook een eigen functie hebben. Bijvoorbeeld om punten toe te voegen aan de speler of om informatie te tonen.

Objecten en this

In onderstaande code kom je ook een nieuw concept tegen, this. Dit is voor veel programmeurs in het begin lastig te begrijpen en soms lijkt het een beetje op magie. Maar het is eigenlijk heel simpel. In een object verwijst this naar het object zelf. Omdat in het object de variabele van het object niet gebruikt kan worden, gebruiken we this.

Deze gebruiken we uiteraard ook in de makeObject functie

function makeObject(name, age, points) {
    return {
        name: name,
        age: age,
        points: points,
        addPoint : function() { this.points = this.points + 1; }
    };
}

let playerOne = makeObject("Pascal", 30, 0);
console.log(playerOne.points); //0
playerOne.addPoint();
console.log(playerOne.points); //1
playerOne.addPoint();
console.log(playerOne.points); //2

Tijdens het maken van het object weet je niet de variabele, het object wordt als waarde gebruikt om de variabele aan te passen, en elk object heeft natuurlijk een andere variabele.
addPoint: function() { playerOne.points = playerOne.points + 1;
Gaat niet werken. Als eerste bestaat playerOne niet als variabele in de functie makeObject en als tweede zou playerTwo (en playerThree/ Four/ Five etc.) nooit puntne krijgen.

Functies met parameters

Het kan voorkomen dat je niet maar 1 punt wilt toevoegen, maar dat dit dynamisch kan, bijvoorbeeld omdat je bij gelijkspel beide spelers 1 punt geeft en bij winst 3 punten. Dan is het niet altijd maar 1 punt maar een dynamisch getal, dat kan ook door te werken met parameters in de functie en argumenten mee te geven.

function makeObject(name, age, points) {
    return {
        name: name,
        age: age,
        points: points,
        addPoint : function(points) { this.points = this.points + points; }
    };
}

let playerOne = makeObject("Pascal", 30, 0);
console.log(playerOne.points); //0
playerOne.addPoint(1);
console.log(playerOne.points); //1
playerOne.addPoint(25);
console.log(playerOne.points); //26