Valkuilen bij methode-extractie en partiële toepassing
Los problemen met methode-extractie op met call/apply/bind en leer kleine patronen voor partiële toepassing met bind en wrapper-pijlfuncties
Valkuilen bij methode-extractie en partiële toepassing is een gratis JavaScript Academy-les op CoddyKit. Dit is les 2 van 3. Je kunt 3 lessen uit dit leerpad gratis volledig lezen — daarna ontgrendelt CoddyKit PRO alle lessen, plus praktische oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject JavaScript Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus JavaScript Academy bevat in totaal 3 lessen.
Het grote geheel
Doel: this stabiel houden na het loskoppelen en argumenten vooraf invullen.
- call(thisArg, a, b)
- apply(thisArg, [a, b])
- bind(thisArg, a) → retourneert een nieuwe functie
- Gedeeltelijke toepassing met bind of een kleine pijlfunctie
Valkuil bij loskoppelen
Aanroepen als obj.method() werkt, maar door de functie los te koppelen gaat het object verloren en werkt this niet meer.
// Extraction loses this
const user = {
name: "Ayla",
label: function (prefix) {
return prefix + ":" + this.name;
}
};
console.log("method call:", user.label("Hi")); // "Hi:Ayla"
// Extract
const f = user.label;
console.log("extracted:", f("Hi")); // this is missing -> "Hi:undefined" (in strict mode this is undefined)
call/apply voor eenmalig gebruik
Met call en apply kun je this instellen voor één aanroep.
// Fix by passing this explicitly using call/apply
console.log("call :", f.call(user, "Hi")); // "Hi:Ayla"
console.log("apply:", f.apply(user, ["Yo"])); // "Yo:Ayla"
bind voor hergebruik
bind maakt een functie die this onthoudt. Roep die functie meerdere keren aan zonder opnieuw te binden.
// bind returns a new function with this fixed
const bound = f.bind(user);
console.log("bound once:", bound("Hey")); // "Hey:Ayla"
console.log("bound again:", bound("Yo")); // "Yo:Ayla"
Gedeeltelijke toepassing (eenvoudig)
Gebruik bind om vooraanstaande argumenten vooraf in te vullen, of gebruik een kleine omhullende pijlfunctie om waarden en this vast te leggen.
// Partial application: pre-fill arguments
function add(a, b, c) { return a + b + c; }
// Using bind: pre-fill a=10
const add10 = add.bind(null, 10);
console.log("add10(1,2):", add10(1, 2)); // 13
// Using an arrow wrapper: pre-fill prefix
const labelHi = function (obj) {
return function () { return obj.label("Hi"); };
}(user);
console.log("arrow partial:", labelHi()); // "Hi:Ayla"
Praktische patronen
Tips:
- Losgekoppelde methoden: gebruik bind één keer en hergebruik de gebonden functie.
- Eenmalige aanroepen: gebruik call/apply.
- Argumenten vooraf invullen? Gebruik bind of een kleine omhullende pijlfunctie.
- Houd hulpfuncties klein en geef ze duidelijke namen.
Quiz over bind versus call/apply
Snelle controle: this behouden en argumenten vooraf invullen.
Samenvatting
Samenvatting: Door loskoppelen gaat this verloren. Gebruik call/apply voor eenmalige aanroepen en bind om this vast te leggen en functies opnieuw te gebruiken. Gebruik voor gedeeltelijke toepassingen bind of een kleine pijlfunctie om waarden vooraf in te vullen.
Leer JavaScript met een AI-tutor — gratis
Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.
- Cursussen
- 59
- Lessen
- 200
Veelgestelde vragen
Is de les “Valkuilen bij methode-extractie en partiële toepassing” gratis?
Ja — je kunt hier op het web alle 3 lessen van het leerpad JavaScript Academy, waaronder “Valkuilen bij methode-extractie en partiële toepassing”, gratis volledig lezen. Daarna ontgrendelt CoddyKit PRO alle lessen, plus interactieve oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. De cursus JavaScript Academy bevat in totaal 3 lessen.
Wat leer ik in “Valkuilen bij methode-extractie en partiële toepassing”?
Los problemen met methode-extractie op met call/apply/bind en leer kleine patronen voor partiële toepassing met bind en wrapper-pijlfuncties Je oefent met JavaScript Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.
Heb ik ervaring nodig om met JavaScript Academy te beginnen?
Ervaring vooraf is niet nodig. JavaScript Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 2 van 3.
Hoe lang duurt de les “Valkuilen bij methode-extractie en partiële toepassing”?
De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.
Kan ik code schrijven en uitvoeren in deze les over JavaScript Academy?
Ja. Elke les over JavaScript Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.
Alle lessen in deze cursus
- Lexicale versus dynamische this, pijlfuncties opnieuw bekeken
- Valkuilen bij methode-extractie en partiële toepassing
- Functionele alternatieven — context doorgeven, closures en kleine hulpfuncties