Interested in programming since an early age; decades as a hobbiest; years as a teacher and tutor. These days working a lot with JavaScript and Python, but I try to explore everything.
I don't think it's the arrow function per se that's making the difference in your example, but rather the additional scope introduced by the showIndexWhenHover function. The variable 'index' in the event handler function binds to the index argument of showIndexWhenHover, rather than the global index variable.
The same code works as expected if the arrow functions are replaced with regular old function statements.
var index = 2387237;
const showIndexWhenHover = function (div, index) {div.addEventListener(
'mouseenter',
function () { console.log(`${index} :: ${div.className}`); }
);};
([...(document.getElementsByTagName('div'))]).map(showIndexWhenHover);
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
That problem solved the arrow functions. Because bind her closure, so in this example mouseenter function
() => console.log(`${index} :: ${div.className}`)
use index and div.className;
I don't think it's the arrow function per se that's making the difference in your example, but rather the additional scope introduced by the showIndexWhenHover function. The variable 'index' in the event handler function binds to the index argument of showIndexWhenHover, rather than the global index variable.
The same code works as expected if the arrow functions are replaced with regular old function statements.