dentro de JavaScript, ¿cómo puedo decir que algo se haga en un cierto período de tiempo? Por ejemplo, durante 5 segundos, el valor de una variable aumentará y se detendrá después de 5 segundos. Por supuesto, hay setinterval y settimeout, pero solo hacen ese trabajo después de que finaliza ese período de tiempo. Quiero que ese trabajo se haga durante ese tiempo.
establecerIntervalo
Puede usar setInteveral , pero en su mayoría es basura para todo lo que he intentado usar. En el siguiente código, el contador solo se incrementará a alrededor de 35 en 1 segundo; unos 28 milisegundos por intervalo -
// initialize a counter let counter = 0 // increment the counter on interval let myprocess = setInterval(_ => counter++, 0) // after 5 seconds, stop the process and log the counter value setTimeout(_ => { clearInterval(myprocess); console.log(counter) }, 1000)Una utilidad más apropiada sería setImmediate . Es compatible con Node pero aún no con los navegadores. Polyfills están disponibles si planea usar esto en el navegador.
generadores asíncronos
Arriba vemos que setInterval es bastante lento. Otro enfoque es utilizar un generador asíncrono. En el siguiente código, el contador puede llegar a más de 300 000 en solo 1 segundo; Alrededor de 3,3 microsegundos por intervalo.
async function *count(until) { let counter = 0 while (Date.now() < until) { yield counter++ } } async function main() { for await (const n of count(Date.now() + 1000)) document.write(`${n}, `) return "done" } main().then(console.log) Si el objetivo es ejecutar el proceso lo más rápido posible durante la duración fija, omitiremos operaciones costosas como document.write . En el siguiente ejemplo, el contador puede alcanzar más de 1M en solo 1 segundo; poco menos de 1 microsegundo por intervalo -
async function *count(until) { let counter = 0 while (Date.now() < until) { yield counter++ } } async function run(process, duration) { let result for await (const n of process(Date.now() + duration)) result = n return result } run(count, 1000).then(console.log) // 1045592bloqueo mientras bucle
Si el bucle en sí es la parte principal de su programa y simplemente desea ejecutar el contador lo más rápido posible durante un tiempo fijo, use un bucle while . Tenga en cuenta que esto bloqueará la ejecución de todos los demás códigos durante toda la duración del ciclo:
function count(until) { let n = 0 while (Date.now() < until) n++ return n } setTimeout(console.log, 0, "I was blocked") console.log(count(Date.now() + 1000)) // 36618673 // "I was blocked"Deberá verificar dentro de algún tipo de bucle si el tiempo ha pasado, asegúrese de que el bucle sea de naturaleza asíncrona o el subproceso principal de JS tendrá problemas.
Modifiqué la calculadora PI desde aquí Javascript: Calculadora PI (π) para que se ejecute durante 5 segundos en lugar de infinito, está usando requestAnimationFrame para mantener las cosas asíncronas->
function * generateDigitsOfPi() { let q = 1n; let r = 180n; let t = 60n; let i = 2n; while (true) { let digit = ((i * 27n - 12n) * q + r * 5n) / (t * 5n); yield Number(digit); let u = i * 3n; u = (u + 1n) * 3n * (u + 2n); r = u * 10n * (q * (i * 5n - 2n) + r - t * digit); q *= 10n * i * (i++ * 2n - 1n); t *= u; } } // Demo let iter = generateDigitsOfPi(); const tmStart = Date.now();// let output = document.querySelector("div"); (function displayNextDigit() { output.insertAdjacentHTML("beforeend", iter.next().value); scrollTo(0, document.body.scrollHeight); if (Date.now() - tmStart < 5000) requestAnimationFrame(displayNextDigit); })(); div { word-wrap:break-word; font-family: monospace } <div></div> const setRunInSeconds = (callback, ms = 1000, delay = 1) => { const intervalId = setInterval(callback, delay) setInterval(() => { clearInterval(intervalId) }, ms) } let num = 0 setRunInSeconds(() => { console.log('interval: ' + num) num += 1 }, 5000, 1)