Soy bastante nuevo en javascript y estaba practicando un poco con eventos en W3Schools. En su tutorial, muestran esta línea de código:
document.getElementById("demo").onkeydown = function() {myFunction()}; function myFunction() { document.getElementById("demo").style.backgroundColor = "red"; }No entiendo por qué tiene que escribir function () {nombre de función ()} en lugar de simplemente escribir la función que está tratando de llamar. Básicamente, no entiendo la lógica detrás de esa línea de código. ¿Puede alguien explicarmelo?
No necesita function , solo puede poner el nombre de la función allí.
document.getElementById("demo").onkeydown = myFunction; function myFunction() { document.getElementById("demo").style.backgroundColor = "red"; } <input id="demo">Tendría que envolverlo dentro de otra función si quisiera hacer algo más que simplemente llamar a la función directamente.
document.getElementById("demo").onkeydown = function() { console.log("Keydown"); myFunction(); }; function myFunction() { document.getElementById("demo").style.backgroundColor = "red"; } <input id="demo">Puedes hacerlo , debes pasarlo como referencia:
document.getElementById("demo").onkeydown = myFunction(); - myFunction se llamará inmediatamente y no como devolución de llamada. La devolución de llamada sería el valor de retorno de myFunction .
Les asignas como referencia:
document.getElementById("demo").onkeydown = myFunction - tenga en cuenta que aquí no puede pasar parámetros en tiempo de ejecución.
En el ejemplo que das:
document.getElementById("demo").onkeydown = function() {myFunction()}; function myFunction() { document.getElementById("demo").style.backgroundColor = "red"; }el valor de la propiedad onkeydown de un elemento debe ser una función, no una llamada a una función. Así que no podrías tener por ejemplo:
document.getElementById("demo").onkeydown = myFunction();Lo que eso haría sería intentar ejecutar myFunction y poner el resultado de eso en la propiedad onkeydown.
En realidad, fallaría ya que en el momento en que el sistema intentó ejecutarlo, esa función aún no existe.
Lo que podría hacer es declarar la función primero y luego usarla como valor para la asignación.
function myFunction() { document.getElementById("demo").style.backgroundColor = "red"; } document.getElementById("demo").onkeydown = myFunction;