Agregue la función Timeout / Sleep dentro del bucle javascript
Estoy tratando de agregar una función de suspensión / retraso dentro de un archivo js, este:
var webTest = function()
{
let regex = /^https?:\/\//;
let url = $('#list_urls').val().split('\n');
var xmlhttp = [], i;
var myObj2 = [], i;
for(let i = 0; i < url.length; i++)
{
(function(i) {
xmlhttp[i] = new XMLHttpRequest();
url[i] = url[i].replace(regex, '');
xmlhttp[i].open("GET", "https://website.com/API?key=<MY_API_KEY>&url="+url[i], false);
xmlhttp[i].onreadystatechange = function() {
if (xmlhttp[i].readyState === 4 && xmlhttp[i].status === 200) {
myObj2 = JSON.parse(xmlhttp[i].responseText);
document.getElementById("demo"+i).innerHTML = myObj2.results[1].categories;
}
};
xmlhttp[i].send();
})(i);
console.log(`The Server2: `+ myObj2);
}
}
Quiero que esta secuencia de comandos para hacer una pausa durante 10 segundos y luego otra vez hacer el trabajo y luego de nuevo una pausa durante 10 segundos y me gusta esta longitud de texto hasta el thatn es mayor que en el bucle! Mi código funciona si lo ejecuto una sola vez, pero no funciona si lo ejecuto en bucle porque el sitio web tiene un límite de velocidad en la API, por eso estoy tratando de agregar una función de suspensión.
Así que lo que he intentado es esperar a dormir (); y también probé el método setTimeout , pero no funciona como se esperaba en la clasificación, ¡no funciona en absoluto con mi código!
esperar dormir (); simplemente no funciona en absoluto y muestra msg como Uncaught SyntaxError: await solo es válido en funciones asíncronas y generadores asíncronos webTestfile.js: 27
Respuestas
Puede hacer uso de la ES6 async/await-feature !
Para usarlo await, debe estar en un cuerpo de función / expresión declarado async.
Básicamente, esto hará que su función sea asincrónica y esperará a Promiseque se cumpla. Hacemos que esa promesa se cumpla después de un retraso establecido al usar setTimeout().
Tenga en cuenta que "después de un retraso establecido" no significa "exactamente después", básicamente significa "lo antes posible después".
Al hacer esto, la función asincrónica espera a que se cumpla la promesa, liberando la pila de llamadas mientras tanto para que se pueda ejecutar otro código.
El orden de ejecución de este ejemplo está (simplificado) como sigue:
sleepingFunc()se coloca en la pila de llamadas- En iteración:
awaitpara que se cumpla la promesa, suspender esta llamada 🡒 liberar la pila de llamadas
- En iteración:
- Realizar nuevas llamadas en la pila de llamadas
- Finalmente, la promesa se cumple y finaliza
await🡒 realizar la devolución de llamada suspendida en la pila de llamadas - Repite hasta
sleepingFunc()terminar
Como puede ver en el paso 3, si otras llamadas toman más tiempo que el retraso, la llamada suspendida tendrá que esperar más ese tiempo adicional.
function sleep(ms) {
return new Promise(resolveFunc => setTimeout(resolveFunc, ms));
}
async function sleepingFunc() {
for (let i = 0; i < 5; ++i) {
console.log(i + " - from sleep");
await sleep(1000);
}
}
function synchronousFunc() {
for (let i = 0; i < 5; ++i) {
console.log(i + " - from sync");
}
}
sleepingFunc();
synchronousFunc();
Este fragmento ejecuta una tarea cada 1 segundo hasta que se cumple la condición y luego borra el temporizador.
const work = (i)=>{
console.log('doing work here ', i);
}
let counter = 0
const timer = setInterval(()=>{
if (timer && ++counter >= 10) {
clearInterval(timer)
}
work(counter);
}, 1000)