I am confused by the behavior of callback function inside event listener. It works.
function main(){
const value="lorem"
document.addEventListener("click",()=>{
console.log("clicked")
console.log(value)
})
}
main()
But this doesn't works. The error thrown is Uncaught ReferenceError: value is not defined
function handleClick(){
console.log("clicked")
console.log(value)
}
function main(){
const value="lorem"
document.addEventListener("click",handleClick)
}
main()
This also doesn't work.
function handleClick(){
console.log("clicked")
console.log(value)//but this doesn't
}
function main(){
const value="lorem"
document.addEventListener("click",function(){
console.log(value)//this works
handleClick()
})
}
main()
In the latest case , how can I access value inside the inline callback function but not inside handleClick function called by the inline callback function ?
So how can I access value inside callback handleClick? Except doing this:
function handleClick(value){
console.log("clicked")
console.log(value)//now it works
}
function main(){
const value="lorem"
document.addEventListener("click",function(){
console.log(value)//this works
handleClick(value)
})
}
main()
