0
263
Vistas¿Por qué se omite el paréntesis al llamar a una función en la salida del control deslizante de actualización de JavaScript correctamente, pero cuando se incluye el paréntesis se crea un error?
La salida de mi control deslizante que lee el valor dado/actualizado por el usuario usando el controlador de eventos de entrada no se actualiza correctamente cuando llamo usando
slider.oninput = updateGridRange();sintaxis con paréntesis, más bien me da el mismo valor predeterminado de 16x16. Sin embargo, el código funciona muy bien sin ese error cuando llamo usando
slider.oninput = updateGridRange; ¿Cuál es la diferencia en JavaScript cuando llamo a una función sin parámetros definidos functionExample() y functionExample sin paréntesis? ¿Por qué se crea un error en mi código cuando ocurre esta situación?
function createSlider() { const slider = document.createElement('input'); slider.setAttribute('type', 'range'); slider.setAttribute('min', '1'); slider.setAttribute('max', '100'); slider.setAttribute('value', '16'); document.querySelector('div.slider-container').appendChild(slider); const sliderText = document.createElement('div'); sliderText.classList.add('slider-text'); document.querySelector('div.slider-container').insertBefore(sliderText, document.querySelector('div.slider-container').firstChild); sliderText.textContent = `${slider.value} x ${slider.value}`; slider.oninput = updateGridRange; //updateGridRange() causes bug } function updateGridRange() { document.querySelector('div.slider-container div.slider-text').textContent = `${document.querySelector('input').value} x ${document.querySelector('input').value}`; }Imágenes de control deslizante
Insecto
Bueno
2 Respuestas
Responde la pregunta0
updateGridRange es la función en sí, y eso es lo que debe pasar.
updateGridRange() es el resultado de llamar a updateGridRange , es decir, es cualquier valor devuelto al llamar a updateGridRange .
Dado que no tiene un valor de retorno para la función updateGridRange , updateGridRange() es realmente lo mismo que undefined .
0
al hacer
slider.oninput = updateGridRange; está asignando la función en la variable denominada updateGridRange y se llamará más tarde (una devolución de llamada).
Solo desea que se active cuando ocurre el evento slider.oninput , por lo que no desea llamar a la función de inmediato. Poner paréntesis al final de una variable que contiene una función la invocará de inmediato, por lo que se comporta mal.