These two usages below seem work fine:
document.querySelector(`button`).addEventListener(`click`, delayedClickButton);
const timeout = 1000;
function delayedClickButton(evt) {
setTimeout(
function (){clickButton(evt)},
timeout
);
}
function clickButton(evt) {
evt.target.style.color = `red`;
}<button>Click</button>document.querySelector(`button`).addEventListener(`click`, delayedClickButton);
const timeout = 1000;
function delayedClickButton(evt) {
setTimeout(
function (){return clickButton(evt);},
timeout
);
}
function clickButton(evt) {
evt.target.style.color = `red`;
}<button>Click</button>Which one is correct when I want a click event handling function that is delayed for 1 second, and I want to access the target element in that function by using evt.target.
The return statement isn't needed so the first example is better, although they both work. returns are useful for when we want to do something with a resulting value e.g.
const myFunc = ()=>{
return 'I returned something'
}
console.log(myFunc())