Entkoppeln anonymer Funktionen in JavaScript

Nehmen wir an, an unsere Absätze ist nun eine anonyme Funktion gebunden:

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

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

Nehmen wir an, wir möchten diese Funktion vom Absatz nach einem Klick auf diesen Absatz entkoppeln. Uns erwartet jedoch ein Problem: Die Funktion hat keinen Namen, was bedeutet, dass wir nicht über diesen Namen auf sie zugreifen können, um sie zu entkoppeln.

Um das Problem zu lösen, müssen wir der Funktion einen Namen geben, indem wir sie in einen benannten Funktionsausdruck umwandeln. Tun wir dies:

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

for (let elem of elems) {
	elem.addEventListener('click', function func() { // gab der Funktion einen Namen
		console.log(this.textContent);
	});
}

Nun kann diese Funktion innerhalb von sich selbst entkoppelt werden:

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

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

Gegeben ist eine Liste ul, in der in jedem Punkt eine Zahl steht. Sorgen Sie dafür, dass bei einem Klick auf ein beliebiges li deren Zahl um eins erhöht wird.

Modifizieren Sie die vorherige Aufgabe so, dass jedes li seinen Wert nur beim ersten Drücken erhöht.

Modifizieren Sie die vorherige Aufgabe so, dass jedes li seinen Wert nur erhöht, wenn ihr Wert kleiner als 10 ist.