Avatar ·

Cómo hacer que los closures en un bucle recuerden el valor de la variable de su iteración en JavaScript

¡Hola a todos! Soy nuevo en JavaScript y me encontré con un problema que no entiendo en absoluto. Estoy escribiendo un código simple: quiero agregar manejadores de click a varios botones, para que cada uno muestre su número. Aquí está mi código: ```javascript const buttons = document.querySelectorAll('button'); for (var i = 0; i < buttons.length; i++) { buttons[i].addEventListener('click', function() { console.log('Botón número ' + i); }); } ``` Pero cuando hago clic en cualquier botón, siempre se muestra en la consola "Botón número 5" (el último valor de i), sin importar en qué botón haya hecho clic. Leí que esto está relacionado con los closures, pero no entiendo cómo solucionarlo. ¿Por qué sucede esto? ¿Cómo hago para que cada botón recuerde su número? Explíquenme, por favor, en palabras sencillas con ejemplos. ¡Gracias de antemano! <<>>

¿Por qué surge el problema?

El problema está relacionado con cómo funcionan los closures y el ámbito de la variable declarada con var. La palabra clave