JavaScript Sleep Funktion wird nur einmal auseführt

[the fred]

Hallo zusammen,

ich habe ein kleines Problem mit einer Sleep Funktion. Diese wird merkwürdigerweise einmal am Anfang ausgeführt. Bei jedem darauffolgenden Durchlauf jedoch nicht mehr.

Meine Annahme ist, das der Promise in der Sleep Funktion nur einmal gesetzt wird und dann immer den passenden wert besitzt und daher überpsrungen wird. Das kann ich mir aber irgendwie nicht vorstellen, da dieser bei jedem aufrufen der Funktion neu erstellt wird.

Irgendwo habe ich dort einen Denkfehler, finde diesen jedoch nicht.

Eventuell könnt ihr mir dabei weiterhelfen.

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

async function durchlauf() {
    await sleep(3000);
    a = a + 1;
    b = b + 1;
            
    document.getElementById('ausgabe_a').innerHTML = "A " + a;
    document.getElementById('ausgabe_b').innerHTML = "B " + b;
}

for (var x=0;x<500;x++) {
     durchlauf();
}

Ergänzung (10. Juli 2018)

Entschuldigt bitte den Schreibfehler im Titel.

 

[weiserhei]

Die sleep funktion wird mit deinem Code bei mir 500x ausgeführt (Firefox). Woher kommt deine Annahme?

Sofern du a und b außerhalb noch als integer initialisiert hast, zählen die Variablen auch von 1-500 hoch:

let a = 0, b = 0;

 

[NullPointer]

Das Problem ist, dass durchlauf eine async-Funktion ist, du es aber ohne await aufrufst. Dadurch werden alle 500 Aufrufe direkt hintereinander gestartet, ohne zu warten, bis die vorherigen fertig sind. Du müsstest es also etwa so umbauen:

// ...

async function schleife() {
  for (var x=0;x<500;x++) {
    await durchlauf();
  }
}

schleife();

(Nachtrag: die extra Funktion schleife ist notwendig, da await nur innerhalb einer async-Funktion benutzt werden kann, du kannst also nicht einfach so "await" vor dein "durchlauf();" schreiben.)

 

[the fred]

Das Problem ist, ..... Du müsstest es also etwa so umbauen:

// ...

async function schleife() {
  for (var x=0;x<500;x++) {
    await durchlauf();
  }
}

schleife();

(Nachtrag: die extra Funktion schleife ist notwendig, da await nur innerhalb einer async-Funktion benutzt werden kann, du kannst also nicht einfach so "await" vor dein "durchlauf();" schreiben.)

Ah, bin ich nicht drauf gekommen. Funktioniert nun ohne Probleme.

Vielen Dank.