Ajout de la fonction Timeout / Sleep dans la boucle javascript

Nov 24 2020

J'essaie d'ajouter une fonction de veille / délai dans un fichier js, celui-ci:

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);
 }
}

Je veux que ce script pour mettre en pause pendant 10 secondes, puis à nouveau faire le travail, puis de nouveau une pause pendant 10 secondes et aime cette longueur jusqu'à ce texte est plus quen i en boucle! Mon code fonctionne si je cours pour une seule fois, mais cela ne fonctionne pas si je cours en boucle car le site Web a une limite de débit dans l' API , c'est pourquoi j'essaie d'ajouter une fonction de veille.

Donc, ce que j'ai essayé, c'est attendre sleep (); et a également essayé la méthode setTimeout mais cela ne fonctionne pas comme prévu en tri, cela ne fonctionne pas du tout avec mon code!

attendre le sommeil (); ne fonctionne tout simplement pas et affiche des msg comme Uncaught SyntaxError: await n'est valide que dans les fonctions asynchrones et les générateurs asynchrones webTestfile.js: 27

Réponses

2 OskarGrosser Nov 25 2020 at 00:10

Vous pouvez utiliser la fonction async/awaitES6 !

Pour l'utiliser await, il doit être dans un corps de fonction / expression déclaré async.

Fondamentalement, cela rendra votre fonction asynchrone et la fera attendre qu'elle Promisesoit remplie. Nous faisons en sorte que cette promesse soit remplie après un délai défini en utilisant setTimeout().
Notez que "après un délai défini" ne signifie pas "exactement après", cela signifie essentiellement "le plus tôt possible après".

En faisant cela, la fonction asynchrone attend que la promesse soit remplie, libérant la pile d'appels entre-temps afin que d'autres codes puissent être exécutés.

L'ordre d'exécution de cet exemple est (simplifié) comme suit:

  1. sleepingFunc() est placé sur la pile d'appels
    • En itération: awaitpour que la promesse soit remplie, suspendre cet appel 🡒 libérer la pile d'appels
  2. Placez de nouveaux appels sur la pile d'appels
  3. Finalement, la promesse est remplie, se terminant await🡒 placez un rappel suspendu sur la pile d'appels
  4. Répéter jusqu'à la sleepingFunc()fin

Comme vous pouvez le voir à l'étape 3, si d'autres appels prennent plus de temps que le délai, l'appel suspendu devra attendre plus longtemps.

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();

2 Jkarttunen Nov 24 2020 at 22:48

Cet extrait de code exécute une tâche toutes les 1 seconde jusqu'à ce que la condition soit satisfaite, puis efface le minuteur.

const work = (i)=>{
 console.log('doing work here ', i);
}

let counter = 0
const timer = setInterval(()=>{
  if (timer && ++counter >= 10) {
   clearInterval(timer)
  }
  work(counter);
}, 1000)