Cómo resolver Var fuera de alcance dentro de la llamada a setTimeout

Question

Estoy intentando llamar a un setTimeout desde una devolución de llamada setInterval:

function callback()
{
   //assign myVar
   var myVar = document.getElementById("givenID");
   //...
   //now wait 2 secs then call some code that uses myVAr
   setTimeout("myVar.innerHTML = 'TEST'", 2000);
}

setInterval("callback();", 10000);

setInterval funciona como se esperaba pero la llamada a setTimeout está fallando. Supongo que el problema está relacionado con el hecho de que estoy haciendo referencia a una variable (myVar) que no está dentro del alcance.

¿Cuál es la mejor manera de resolver esto?

Answer 1

Este es un candidato perfecto para cierres:

setInterval(
    function ()
    {
       var myVar = document.getElementById("givenID");
       setTimeout(
          function()
          {
              // myVar is available because the inner closure 
              // gets the outer closures scope
              myVar.innerHTML = "Junk";
          },2000);
    }, 10000);

Su problema está relacionado con el alcance, y esto podría solucionarlo.

Answer 2

Tuve un problema similar. El problema era que estaba intentando llamar a un método desde dentro de sí mismo a través de un setTimeout (). Algo como esto, que no me funcionó:

function myObject() {

   this.egoist = function() {
      setTimeout( 'this.egoist()', 200 );
   }

}

myObject001 = new myObject();
myObject001.egoist();

Lo siguiente TAMBIÉN NO TRABAJÓ:

... setTimeout( egoist, 200 );
... setTimeout( egoist(), 200 );
... setTimeout( this.egoist, 200 );
... setTimeout( this.egoist(), 200 );
... setTimeout( function() { this.egoist() }, 200 );

La solución fue usar con la instrucción () de esta manera:

function myObject() {

   this.egoist = function() {
      with (this) { setTimeout( function() { egoist() }, 200 );}
   }

}

myObject001 = new myObject();
myObject001.egoist();

Por supuesto, este es un ciclo sin fin, pero el punto que estoy señalando aquí es diferente.

Espero que esto ayude :)

Answer 3

Como práctica recomendada, intente no usar cadenas como parámetros para setTimeout y setInterval porque eso invocará a eval .. . El uso del siguiente formulario también podría hacer que este problema sea más fácil de entender / depurar:

setInterval(function () {
    // do stuff
    // ...
    // now wait 2 secs then call someFunction
    setTimeout(someFunction, 2000);
}, 10000);

Answer 4

Ejecutalo en Firefox y verifica Herramientas | Consola de errores. si setTimeout falla, es posible que te diga por qué.

También, intenta reemplazar " someFunction (); " con " alert ('hi') " (sin punto y coma) y ver si funciona. Si es así, el problema se reduce significativamente.