Ha pasado un tiempo desde que trabajé en JavaScript y algo me dejó perplejo. Estoy tratando de llamar a una función en un cambio de entrada, pero la función se estaba ejecutando solo en la carga de la página.
let textInput.document.getElementById('input'); textInput.addEventListener('input', myFunction());Solo se ejecuta al cargar la página y no parece escuchar el evento en absoluto. Pero
let textInput.document.getElementById('input'); textInput.addEventListener('input', function() { myFunction(); });funciona como se esperaba. Miré a mi alrededor tratando de averiguar por qué sucede esto, pero los documentos que revisé parecen indicar que debería poder simplemente llamar a myFunction() dentro del oyente, sin envolverlo en otra función. ¿Alguien puede explicarme qué está pasando aquí, por favor?
La función toma la función como una variable, así que en su caso, simplemente haga myFunction en lugar de myFunction() . De la forma en que lo está usando, los argumentos proporcionados al oyente se input y cualquiera que sea su valor de retorno de la función. usando solo myFunction , proporciona la función como un valor.
Cuando tiene una referencia a una función seguida inmediatamente por () , ejecutará la función en el momento en que se evalúe la declaración. Esto es cierto sin importar el contexto.
someFn(someOtherFn());es equivalente a
const innerResult = someOtherFn(); someFn(innerResult); addEventListener funciona de la misma manera: solo tiene una pequeña complicación adicional que requiere más argumentos. Es por eso que textInput.addEventListener('input', myFunction()); ejecutará myFunction siempre que se ejecute la línea addEventListener .
los documentos que he revisado parecen indicar que debería poder simplemente llamar a myFunction() dentro del oyente, sin envolverlo en otra función
Esto es cierto: puede pasar solo la función en sí , sin llamarla:
textInput.addEventListener('input', myFunction)