javascript - attribute - Cronometraje en JS: ¿varios setIntervals ejecutándose a la vez y comenzando al mismo tiempo?

title html

Question

Digamos que tengo una función:

myFunc = function(number) {
console.log("Booyah! "+number);
}

Y quiero que se ejecute en un intervalo establecido. Parece que debería usar setInterval , ¡eh!

Pero, ¿qué sucede si deseo ejecutar varios intervalos de la misma función, todos comenzando exactamente al mismo tiempo?

setInterval(function(){
myFunc(1);
}, 500);
setInterval(function(){
myFunc(2);
}, 1000);
setInterval(function(){
myFunc(3);
}, 2000);

De modo que el primero se ejecuta exactamente dos veces en el tiempo que tarda el segundo en ejecutarse una vez, y lo mismo entre el segundo y el tercero.

¿Cómo se asegura de que todos comiencen al mismo tiempo para que estén sincronizados?

Answer 1

Buena pregunta, pero en JS no puedes. Para que se ejecuten varias funciones en el mismo programa al mismo tiempo, se necesitan múltiples subprocesos y algunas habilidades de sincronización profunda y manejo de subprocesos. JS es de un solo hilo. setInterval no ejecuta la función de forma setInterval después de la demora, más bien, después de la demora, agrega la función a la pila de eventos para que se ejecute tan pronto como el procesador pueda acceder a ella. Si el proceso está ocupado con otra operación, demorará más que el período de demora en ejecutarse. Múltiples intervalos / tiempos de espera están agregando llamadas a la misma pila de eventos, por lo que se ejecutan por turnos cuando el proceso esté disponible.

Answer 2

JavaScript es de un solo hilo. Puede usar html5 web worker o intentar usar setTimeout de forma recursiva. Crea múltiples funciones siguiendo este ejemplo:

var interval = setTimeout(appendDateToBody, 5000);
function appendDateToBody() {
document.body.appendChild(
document.createTextNode(new Date() + " "));
interval = setTimeout(appendDateToBody, 5000);
}

Lee este artículo:

http://weblogs.asp.net/bleroy/archive/2009/05/14/setinterval-is-moderately-evil.aspx

Answer 3

Puedes hacer algo como esto.

arr = Array();
arr[0] = "hi";
arr[1] = "bye";
setTimer0 = setInterval(function(id){
console.log(arr[id])
},1000,(0));
setTimer1 = setInterval(function(id){
console.log(arr[id]);
},500,(1));

¡Espero eso ayude!

Answer 4

function Timer(funct, delayMs, times)
{
if(times==undefined)
{
times=-1;
}
if(delayMs==undefined)
{
delayMs=10;
}
this.funct=funct;
var times=times;
var timesCount=0;
var ticks = (delayMs/10)|0;
var count=0;
Timer.instances.push(this);
this.tick = function()
{
if(count>=ticks)
{
this.funct();
count=0;
if(times>-1)
{
timesCount++;
if(timesCount>=times)
{
this.stop();
}
}
}
count++;
};
this.stop=function()
{
var index = Timer.instances.indexOf(this);
Timer.instances.splice(index, 1);
};
}
Timer.instances=[];
Timer.ontick=function()
{
for(var i in Timer.instances)
{
Timer.instances[i].tick();
}
};
window.setInterval(Timer.ontick, 10);

Y para usarlo:

function onTick()
{
window.alert(''test'');
}
function onTick2()
{
window.alert(''test2'');
}
var timer = new Timer(onTick, 2000,-1);
var timer = new Timer(onTick2, 16000,-1);

Para un número finito de tics, cambie el último parámetro a un entero positivo para el número. Utilicé -1 para indicar funcionamiento continuo.

Ignora a quien te diga que no puedes. ¡Puedes hacerlo hacer lo que quieras!