Vertel over de context van functies in JavaScript…

De uitvoeringscontext (this) van een functie in JavaScript bepaalt hoe de functie wordt aangeroepen en welke waarden binnen de functie beschikbaar zijn. De context verandert dynamisch afhankelijk van de manier van aanroepen:

Globale context: Buiten functies verwijst this naar het globale object (window in de browser, global in Node.js).

// In de browser
console.log(this === window); // true

// In Node.js
console.log(this === global); // true

Context van een functie:
- Standaardaanroep: In niet-strikte modus verwijst this binnen een functie naar het globale object (als de functie geen methode van een object is). In strikte modus ("use strict";) is this undefined.
```
function showThis() {
  console.log(this);
}

showThis(); // In niet-strikte modus: Globaal object; In strikte modus: undefined
```
- Aanroep als methode van een object: this verwijst naar het object waartoe de methode behoort.
```
const user = {
  name: 'Alice',
  greet: function() {
    console.log("Hallo, mijn naam is " + this.name);
  }
};

user.greet(); // Hallo, mijn naam is Alice
```
- Met new (constructor): Maakt een nieuw object dat de waarde van this wordt binnen de constructorfunctie, en retourneert dat object.
```
function Person(name) {
  this.name = name;
}

const person1 = new Person('Bob');
console.log(person1.name); // Bob
```
- Expliciete contextaanduiding (call, apply, bind):
  - call(thisArg, arg1, arg2, ...): Roept de functie aan met de gespecificeerde this en de argumenten die afzonderlijk worden opgesomd.
  - apply(thisArg, [argsArray]): Roept de functie aan met de gespecificeerde this en de argumenten in een array.
  - bind(thisArg, arg1, arg2, ...): Geeft een nieuwe functie terug, waarbij this permanent is gekoppeld aan thisArg en de argumenten vooraf zijn gebonden.
```
function introduce(greeting, punctuation) {
  console.log(greeting + ", ik ben " + this.name + punctuation);
}

const person = { name: 'Charlie' };

introduce.call(person, "Hallo", "!");  // Hallo, ik ben Charlie!
introduce.apply(person, ["Hallo", "."]); // Hallo, ik ben Charlie.

const boundIntroduce = introduce.bind(person, "Hé");
boundIntroduce("?"); // Hé, ik ben Charlie?
```

Arrow functies: Hebben geen eigen this-context. Ze vangen this uit de omringende lexicale scope waarin ze zijn gedefinieerd.

const obj = {
  name: 'David',
  sayLater: function() {
    // `this` hier verwijst naar `obj`
    setTimeout(() => {
      // `this` hier verwijst ook naar `obj` (geërfd van `sayLater`)
      console.log("Later, ik ben " + this.name);
    }, 1000);
  }
};

obj.sayLater(); // Later, ik ben David

Vertel over de context van functies in JavaScript.