javascript - mdn - Cambiar el intervalo de SetInterval mientras se está ejecutando

settimeout java

Question

He escrito una función de JavaScript que usa setInterval para manipular una cadena cada décima de segundo para una cierta cantidad de iteraciones.

function timer() {
    var section = document.getElementById(''txt'').value;
    var len = section.length;
    var rands = new Array();

    for (i=0; i<len; i++) {
        rands.push(Math.floor(Math.random()*len));
    };

    var counter = 0
    var interval = setInterval(function() {
        var letters = section.split('''');
        for (j=0; j < len; j++) {
            if (counter < rands[j]) {
                letters[j] = Math.floor(Math.random()*9);
            };
        };
        document.getElementById(''txt'').value = letters.join('''');
        counter++

        if (counter > rands.max()) {
            clearInterval(interval);
        }
    }, 100);
};

En lugar de tener el intervalo establecido en un número específico, me gustaría actualizarlo cada vez que se ejecuta, basado en un contador. Entonces, en lugar de:

var interval = setInterval(function() { ... }, 100);

Sería algo así como:

var interval = setInterval(function() { ... }, 10*counter);

Desafortunadamente, eso no funcionó. Parecía que "10 * contador" es igual a 0.

Entonces, ¿cómo puedo ajustar el intervalo cada vez que se ejecuta la función anónima?

Answer 1

Esta es mi manera de hacer esto, yo uso setTimeout:

var timer = {
    running: false,
    iv: 5000,
    timeout: false,
    cb : function(){},
    start : function(cb,iv){
        var elm = this;
        clearInterval(this.timeout);
        this.running = true;
        if(cb) this.cb = cb;
        if(iv) this.iv = iv;
        this.timeout = setTimeout(function(){elm.execute(elm)}, this.iv);
    },
    execute : function(e){
        if(!e.running) return false;
        e.cb();
        e.start();
    },
    stop : function(){
        this.running = false;
    },
    set_interval : function(iv){
        clearInterval(this.timeout);
        this.start(false, iv);
    }
};

Uso:

timer.start(function(){
    console.debug(''go'');
}, 2000);

timer.set_interval(500);

timer.stop();

Answer 2

Esto puede iniciarse como lo desee. el tiempo de espera es el método que utilicé para mantenerlo en la parte superior de la hora.

Tenía la necesidad de cada hora para comenzar un bloque de código en la hora. Así que esto comenzaría en el inicio del servidor y ejecutaría el intervalo por hora. Básicamente, la ejecución inicial es comenzar el intervalo dentro del mismo minuto. Entonces en un segundo desde init, ejecuta inmediatamente luego cada 5 segundos.

var interval = 1000;
var timing =function(){
    var timer = setInterval(function(){
        console.log(interval);
        if(interval == 1000){ /*interval you dont want anymore or increment/decrement */
            interval = 3600000; /* Increment you do want for timer */
            clearInterval(timer);
            timing();
        }
    },interval);
}
timing();

Alternativamente, si desea que ocurra algo al inicio y luego para siempre en un intervalo específico, puede llamarlo al mismo tiempo que setInterval. Por ejemplo:

var this = function(){
 //do
}
setInterval(function(){
  this()
},3600000)
this()

Aquí tenemos esta ejecución la primera vez y luego cada hora.

Answer 3

La respuesta simple es que no puede actualizar un intervalo de temporizador ya creado . (Solo hay dos funciones setInterval/setTimer y clearInterval/clearTimer , por lo que tener un timerId solo puede desactivarlo). Pero puede hacer algunas soluciones. Eche un vistazo a este repositorio github .

Answer 4

Me gusta esta pregunta: me inspiró un pequeño objeto de temporizador:

window.setVariableInterval = function(callbackFunc, timing) {
  var variableInterval = {
    interval: timing,
    callback: callbackFunc,
    stopped: false,
    runLoop: function() {
      if (variableInterval.stopped) return;
      var result = variableInterval.callback.call(variableInterval);
      if (typeof result == ''number'')
      {
        if (result === 0) return;
        variableInterval.interval = result;
      }
      variableInterval.loop();
    },
    stop: function() {
      this.stopped = true;
      window.clearTimeout(this.timeout);
    },
    start: function() {
      this.stopped = false;
      return this.loop();
    },
    loop: function() {
      this.timeout = window.setTimeout(this.runLoop, this.interval);
      return this;
    }
  };

  return variableInterval.start();
};

Ejemplo de uso

var vi = setVariableInterval(function() {
  // this is the variableInterval - so we can change/get the interval here:
  var interval = this.interval;

  // print it for the hell of it
  console.log(interval);

  // we can stop ourselves.
  if (interval>4000) this.stop();

  // we could return a new interval after doing something
  return interval + 100;
}, 100);  

// we can change the interval down here too
setTimeout(function() {
  vi.interval = 3500;
}, 1000);

// or tell it to start back up in a minute
setTimeout(function() {
  vi.interval = 100;
  vi.start();
}, 60000);

Answer 5

No pude sincronizar y cambiar la velocidad de mi setIntervals también y estaba a punto de publicar una pregunta. Pero creo que he encontrado una manera. Sin duda debería mejorarse porque soy un principiante. Por lo tanto, gustosamente leeré sus comentarios / comentarios sobre esto.

<body onload="foo()">
<div id="count1">0</div>
<div id="count2">2nd counter is stopped</div>
<button onclick="speed0()">pause</button>
<button onclick="speedx(1)">normal speed</button>
<button onclick="speedx(2)">speed x2</button>
<button onclick="speedx(4)">speed x4</button>
<button onclick="startTimer2()">Start second timer</button>
</body>
<script>
var count1 = 0,
    count2 = 0,
    greenlight = new Boolean(0), //blocks 2nd counter
    speed = 1000,   //1second
    countingSpeed;
function foo(){
    countingSpeed = setInterval(function(){
        counter1();
        counter2();
    },speed);
}
function counter1(){
    count1++;
    document.getElementById("count1").innerHTML=count1;
}
function counter2(){
    if (greenlight != false) {
        count2++;
        document.getElementById("count2").innerHTML=count2;
    }
}
function startTimer2(){
    //while the button hasn''t been clicked, greenlight boolean is false
    //thus, the 2nd timer is blocked
    greenlight = true;
    counter2();
    //counter2() is greenlighted
}

//these functions modify the speed of the counters
function speed0(){
    clearInterval(countingSpeed);
}
function speedx(a){
    clearInterval(countingSpeed);
    speed=1000/a;
    foo();
}
</script>

Si desea que los contadores comiencen a aumentar una vez que se carga la página, ponga counter1() y counter2() en foo() antes de llamar a counter2() . De lo contrario, demora milisegundos de speed antes de la ejecución. EDITAR: respuesta más corta.

Answer 6

Podría usar una función anónima:

var counter = 10;
var myFunction = function(){
    clearInterval(interval);
    counter *= 10;
    interval = setInterval(myFunction, counter);
}
var interval = setInterval(myFunction, counter);

ACTUALIZACIÓN: Como lo sugirió A. Wolff, use setTimeout para evitar la necesidad de clearInterval .

var counter = 10;
var myFunction = function() {
    counter *= 10;
    setTimeout(myFunction, counter);
}
setTimeout(myFunction, counter);

Answer 7

Soy un principiante en JavaScript, y no encontré ninguna ayuda en las respuestas anteriores (pero muchas buenas ideas).
Este fragmento de código a continuación se acelera (aceleración> 1) o desacelera (aceleración <1). Espero que pueda ayudar a algunas personas:

function accelerate(yourfunction, timer, refresh, acceleration) {
    var new_timer = timer / acceleration;
    var refresh_init = refresh;//save this user defined value
    if (refresh < new_timer ){//avoid reseting the interval before it has produced anything.
        refresh = new_timer + 1 ;
    };
    var lastInter = setInterval(yourfunction, new_timer);
    console.log("timer:", new_timer);
    function stopLastInter() {
        clearInterval(lastInter);
        accelerate(yourfunction, new_timer, refresh_init, acceleration);
        console.log("refresh:", refresh);
    };
    setTimeout(stopLastInter, refresh);
}

Con :

• timer : el valor inicial de setInterval en ms (aumentando o disminuyendo)
• refresh : el tiempo antes de que se calcule un nuevo valor de timer . Esta es la duración del paso
• factor : la brecha entre el valor del timer anterior y el siguiente. Esta es la altura del paso

Answer 8

Tenía la misma pregunta que el póster original, hice esto como una solución. No estoy seguro de qué tan eficiente es esto ...

interval = 5000; // initial condition
var run = setInterval(request , interval); // start setInterval as "run"

    function request() { 

        console.log(interval); // firebug or chrome log
        clearInterval(run); // stop the setInterval()

         // dynamically change the run interval
        if(interval>200 ){
          interval = interval*.8;
        }else{
          interval = interval*1.2;
        }

        run = setInterval(request, interval); // start the setInterval()

    }

Answer 9

Una forma mucho más simple sería tener una instrucción if en la función actualizada y un control para ejecutar su comando en intervalos de tiempo regulares. En el siguiente ejemplo, ejecuto una alerta cada 2 segundos y el intervalo ( intrv ) puede cambiarse dinámicamente ...

var i=1;
var intrv=2; // << control this variable

var refreshId = setInterval(function() {
  if(!(i%intrv)) {
    alert(''run!'');
  }
  i++;
}, 1000);

Answer 10

Use setTimeout() lugar. La devolución de llamada sería entonces responsable de disparar el siguiente tiempo de espera, en cuyo punto puede aumentar o manipular el tiempo.

EDITAR

Aquí hay una función genérica que puede usar para aplicar un tiempo de espera de "desaceleración" para CUALQUIER llamada de función.

function setDeceleratingTimeout(callback, factor, times)
{
    var internalCallback = function(tick, counter) {
        return function() {
            if (--tick >= 0) {
                window.setTimeout(internalCallback, ++counter * factor);
                callback();
            }
        }
    }(times, 0);

    window.setTimeout(internalCallback, factor);
};

// console.log() requires firebug    
setDeceleratingTimeout(function(){ console.log(''hi''); }, 10, 10);
setDeceleratingTimeout(function(){ console.log(''bye''); }, 100, 10);

Answer 11

(function variableInterval() {
    //whatever needs to be done
    interval *= 2; //deal with your interval
    setTimeout(variableInterval, interval);
    //whatever needs to be done
})();

no se puede acortar

Answer 12

var counter = 15;
var interval = setTimeout(function(){
    // your interval code here
    window.counter = dynamicValue;
    interval();
}, counter);