Question

在下面的例子中，如何在addEventListener回调函数中使testvar的新值可用？在下面的例子中，testvar的值未定义。

var testvar;
setTimeout(function(){
  var testvar = "testvar value"; 
 }, 3000);

document.querySelector('#anotherButton').addEventListener('click', ()=>{
  console.log('testvar '+testvar);
});

Answer 1

testvar的本地声明隐藏了全局声明。

＆＃13;

var testvar = "Old value";
setTimeout(function(){
  // Here just reuse the global declaration.
  testvar = "testvar value";  
 }, 3000);

document.querySelector('#anotherButton').addEventListener('click', ()=>{
  console.log('testvar: '+ testvar);
});

＆＃13;

<button id="anotherButton">Click me!</button>

＆＃13;

Answer 2

var testvar = ...

您刚刚声明了一个新的局部变量。它与您从未设置的其他变量完全无关。

Answer 3

您需要删除var方法

中的setTimeout符号

var testvar;
setTimeout(function(){
  testvar = "testvar value"; 
 }, 3000);

Answer 4

声明的变量在声明它们的执行上下文中受到约束。

var testvar; // default value undefined

重新声明

testvar 变量，其范围现在在该函数内

setTimeout(function(){
var testvar = "testvar value"; // testvar value and its scope is within this set
 }, 3000);

因此，在setTimeout函数外，testVar变量值为 undefined

要实现预期，请删除var并使其成为全局testVar变量以返回值 - “testvar value”

addEventListener回调中使用的变量未定义

4 个答案: