Het ontkoppelen van anonieme functies in JavaScript

Stel dat er nu een anonieme functie aan onze alinea's is gekoppeld:

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function() {
		console.log(this.textContent);
	});
}

Stel dat we deze functie van de alinea wilten ontkoppelen nadat erop is geklikt. We worden echter geconfronteerd met een probleem: de functie heeft geen naam, wat betekent dat we er niet naar kunnen verwijzen via die naam om hem te ontkoppelen.

Om het probleem op te lossen, moeten we de functie een naam geven, door er een benoemde function expressie van te maken. Laten we dit doen:

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function func() { // gaf de functie een naam
		console.log(this.textContent);
	});
}

Nu kan deze functie binnenin zichzelf worden ontkoppeld:

let elems = document.querySelectorAll('p');

for (let elem of elems) {
	elem.addEventListener('click', function func() {
		console.log(this.textContent);
		this.removeEventListener('click', func); // ontkoppel de functie
	});
}

Gegeven een lijst ul, waarvan elk item een getal bevat. Zorg ervoor dat bij een klik op eender welke li het getal ervan met één wordt verhoogd.

Wijzig de vorige opdracht zo, dat elke li zijn waarde alleen verhoogt bij de eerste keer klikken eraan.

Wijzig de vorige opdracht zo, dat elke li zijn waarde alleen verhoogt als de waarde kleiner is dan 10.