Desvinculando funções anônimas em JavaScript

Suponha que agora uma função anônima esteja vinculada aos nossos parágrafos:

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

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

Suponha que queiramos desvincular esta função do parágrafo após o clique neste parágrafo. No entanto, enfrentamos um problema: a função não tem nome, o que significa que não poderemos referenciá-la por um nome para desvinculá-la.

Para resolver o problema, precisamos dar um nome à função, transformando-a em uma expressão funcional nomeada. Vamos fazer isso:

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

for (let elem of elems) {
	elem.addEventListener('click', function func() { // demos um nome à função
		console.log(this.textContent);
	});
}

Agora esta função pode ser desvinculada dentro dela mesma:

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

for (let elem of elems) {
	elem.addEventListener('click', function func() {
		console.log(this.textContent);
		this.removeEventListener('click', func); // desvinculamos a função
	});
}

Dada uma lista ul, em cada item da qual um número está registrado. Faça com que ao clicar em qualquer li seu número seja incrementado em um.

Modifique a tarefa anterior para que cada li incremente seu valor apenas no primeiro clique nela.

Modifique a tarefa anterior para que cada li incremente seu valor apenas se seu valor for menor que 10.