setTimeout y setInterval diferencia

setTimeout y setInterval diferencia

Ambos métodos son un js nativos de tiempo, pero con diferentes tiempos de ejecución.

• método setTimeout () se utiliza en la expresión de cálculo o llamada de función después de un número especificado de milisegundos. Simplemente hay que decir que después de unos segundos, se me ha entregado a lo que tiene que realizar la tarea. (Ejecutado una vez)

  setTimeout(function(){ alert("Hello"); }, 3000);

• setInterval () de acuerdo con un período especificado (en milisegundos) para la expresión de la función de llamada o de cálculo, hasta que el método clearInterval () se llama o la ventana está cerrada. Simplemente se realiza una vez cada pocos segundos, la ejecución ilimitado.

<script>
    var w, h;
    var canvas = document.querySelector('canvas');
    ~~function setSize() {
        window.onresize = arguments.callee;
        w = window.innerWidth;
        h = window.innerHeight;
        canvas.width = w;
        canvas.height = h;
    }();
    var canCon = canvas.getContext('2d');
    var x = randomNum(0,w);
    var y = 100;
    setInterval(function(){
        canCon.fillStyle = randomColor();
        canCon.arc(x,y++,20,0,2*Math.PI)
        canCon.fill();
    },1000/60);

    // 随机数
    function randomNum(min,max){
        return Math.floor(Math.random() * (max - min) + min);
    }
    // 随机颜色
    function randomColor(){
        var r,g,b,a;
        r = randomNum(0,255);
        g = randomNum(0,255);
        b = randomNum(0,255);
        a = Math.random();
        return `rgba(${r},${g},${b},${a})`;
    }
</script>

En este punto aparece una barra de desplazamiento intermitente.

Pero encuentro setInterval problema más rápido ...

Después de una cuidadosa investigación, que descartó la cuestión de mi propio código, por lo que comenzó a comprobar todo tipo de información. Este es el último en enterarse de sus propios problemas setInterval (). El siguiente pasaje del gángster cita a explicar por qué el uso de setInterval aparecerá un problema cada vez más rápido.

"JavaScript se ejecuta en el entorno de un solo subproceso, por lo que esto significa que un programa de temporizador se ha convertido para ser ejecutado! La regla de hierro no es necesario llevar a cabo! ¿Por qué? Cuando la función comenzó a crear la pila un marco de pila, marco de pila de la aplicación de esta toma tiempo, asumiendo que hay tres segundos, tres segundos en este, JavaScript características de un solo hilo se asegurará de que los esfuerzos de una sola mente dentro de tres segundos para ir a deshacerse de este marco de pila ( función). así que cuando esta función no se está ejecutando la terminación del temporizador de su capacidad de ejecución, por lo que cuando se ejecuta en función del tiempo es mayor que el intervalo, el intervalo de 1 segundo, pero el programa no funciona tan bien como dos segundos terminan, entonces sinceramente, tengo que esperar a la ejecución de la función !!! "

Conocer la causa del problema, a continuación, vamos a ver cómo resolver este problema.

Uso de bucle setTimeout setInterval para resolver problemas cada vez más rápido

var i=0;
    function show() {
        console.log(i);
        i++;
        if(i<5){
            setTimeout(show,1000);
        }
    }
    show();