javascript - not - setTimeout ignora el tiempo de espera?(Incendios inmediatamente)

sleep javascript ejemplo

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Por qué mi llamada de función que debería ser programada por setTimeout se ejecuta inmediatamente? [duplicado] 3 respuestas

Esta es mi primera inmersión real en JavaScript. Seguro que lo he usado antes, pero nunca he escrito nada desde cero.

De todos modos, estoy teniendo un problema muy extraño que espero que alguien pueda descubrir por mí.

Intento hacer que el texto de un div se desvanezca de negro a blanco. Simple, si?

El siguiente código funciona . Cambiará el color a blanco, sin embargo, se está ignorando el tiempo setTimeout de 500 ms.

Si usa Chrome y mira la consola JS, verá fácilmente que el método doFade () se está llamando casi instantáneamente, no cada 500 milisegundos.

¿Alguien puede explicar esto?

var started = false;
var newColor;
var div;
var hex = 0;

function fadestart(){
    if (typeof fadestart.storedColor == ''undefined'') {
        div = document.getElementById(''test'');
        fadestart.storedColor = div.style.color;
    }
    if(!started){
        console.log(''fadestart'');
        newColor = fadestart.storedColor;
        started = true;
        setTimeout(doFade(), 500);
    }
}

function fadestop(){
    console.log(''fadestop'');
    div.style.color = fadestart.storedColor;
    started = false;
    hex = 0;
}

function doFade(){
    if(hex<=238){
        console.log(hex);
        hex+=17;
        div.style.color="rgb("+hex+","+hex+","+hex+")";
        setTimeout(doFade(), 500);
    }
}

Answer 1

Creo que deberías usar setTimeout(doFade, 500); o setTimeout("doFade()", 500);

Answer 2

Debes deshacerte de los paréntesis en doFade() .

Los paréntesis invocan la función al instante.

Solo use esto en lugar: doFade

Answer 3

setTimeout(doFade(), 500);

Esta línea dice "ejecutar doFade() , luego pase cualquier valor que devuelva a setTimeout , que ejecutará este valor de retorno después de 500 milisegundos". Es decir, estás llamando doFade() allí mismo en el acto.

Omita los paréntesis para pasar la función a setTimeout :

setTimeout(doFade, 500);