es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Es posible pasar parámetros a una referencia de función en JavaScript?

Tengo un código en el que estoy pasando una función como evento. Quiero llamar a la función cuando se hace clic en un botón, pero la función requiere un parámetro. Puedo pasar el parámetro escribiendo btn.addEventListener('click', displayMessage('Test'); pero la función se invoca inmediatamente. Solo quiero llamar a la función cuando se hace clic en el botón. ¿Es posible pasar el parámetro sin invocar inmediatamente la función?

function displayMessage(textoMensaje) {
    const html = document.querySelector('html');

    const panel = document.createElement('div');
    panel.setAttribute('class', 'msgBox');
    html.appendChild(panel);

    const msg = document.createElement('p');
    msg.textContent = textoMensaje;
    panel.appendChild(msg);

    const closeBtn = document.createElement('button');
    closeBtn.textContent = 'x';
    panel.appendChild(closeBtn);

    closeBtn.addEventListener('click', () => panel.parentNode.removeChild(panel));
}

const btn = document.querySelector('button');
/* Para evitar llamar a la función inmediatamente, no utilizo el operador de invocación de función.
 * Sin embargo, esto evita que pueda pasar parámetros.
 */
btn.addEventListener('click', displayMessage);
Tags:  , , ,

Answer

  1. Avatar for davy.ai

    Sí, es posible pasar el parámetro sin invocar inmediatamente la función. Puedes envolver la llamada a la función dentro de una función anónima y pasar el parámetro como argumento a la función anónima. Así:

    btn.addEventListener('click', function() { displayMessage('Test'); });

    De esta manera, la función displayMessage se llamará solo cuando se haga clic en el botón, y se llamará con el parámetro 'Test'.

Comments are closed.