Ist es möglich, eine gestoppte Async-Funktion fortzusetzen?

Question

Ich versuche, etwas über Versprechungen zu lernen, und ich frage mich, ob ich eine asynchrone Funktion wie meine Beispielshow starten und stoppen soll. Es fängt am Anfang an und hört auf, wenn Sie auf den Knopf klicken, aber es scheint, kann nicht fortfahren.

var stop = 0; 
 
var elParrafo = document.getElementById('miParrafo'); 
 

 
function sendStop() { 
 
    stop = 1; 
 
} 
 

 
function sendStart() { 
 
    stop = 0; 
 
} 
 

 
function esperar(ms) { 
 
    return new Promise(function(resolve, reject) { 
 
    setTimeout(resolve, ms) 
 
    }); 
 
} 
 

 
async function trabajar() { 
 
    while (stop === 0) { 
 
    elParrafo.innerHTML += " > "; 
 
    await esperar(50); 
 
    } 
 
} 
 

 
trabajar();

<form class="" action="index.html" method="post"> 
 
    <input type="button" value="Stop" onclick="sendStop()"> 
 
    <input type="button" value="Start" onclick="sendStart()"> 
 
</form> 
 
<p id="miParrafo"></p>

Answer 1

Es gibt einen Unterschied zwischen Stoppen/Neustart und Pausieren. Sie beschreiben die Funktion zum Anhalten und Fortfahren.

Wenn Sie anhalten/fortsetzen möchten, müssen Sie die while-Schleife weiterhin ausführen und eine interne Bedingung hinzufügen, um zu überprüfen, ob Sie gerade pausiert sind oder nicht.

Sie könnten natürlich trabajar(); nur neu starten, aber Neustart und Fortsetzung ist logisch 2 verschiedene Dinge und ein Neustart möchte möglicherweise die vorhandene Ausgabe löschen, während weiterhin nicht.

Es gibt wahrscheinlich viele Möglichkeiten, dies zu tun, aber die Schnellste, um Pause/Fortfahren sowie Stopp/Neustart zu demonstrieren, kann ähnlich wie unten ausgeführt werden. Nochmals, fühlen Sie sich frei, einfach trabajar(); zu benennen, aber das liegt an Ihnen.

var stop = false; 
 
var pause = false; 
 
var elParrafo = document.getElementById('miParrafo'); 
 

 
function sendPause() { 
 
    pause = true; 
 
} 
 

 
function sendContinue() { 
 
    pause = false; 
 
} 
 

 
function sendStop() { 
 
    stop = true; 
 
} 
 

 
function sendRestart() { 
 
    sendStop(); 
 
    setTimeout(function() { 
 
    stop = false; 
 
    pause = false; 
 
    elParrafo.innerHTML = ""; 
 
    trabajar(); 
 
    }, 50) 
 
} 
 

 
function esperar(ms) { 
 
    return new Promise(function(resolve, reject) { 
 
    setTimeout(resolve, ms) 
 
    }); 
 
} 
 

 
async function trabajar() { 
 
    while (!stop) { 
 
    if (!pause) { 
 
     elParrafo.innerHTML += " > "; 
 
    } 
 
    await esperar(50); 
 
    } 
 
} 
 

 
trabajar();

<form class="" action="index.html" method="post"> 
 
    <input type="button" value="Pause" onclick="sendPause()"> 
 
    <input type="button" value="Continue" onclick="sendContinue()"> 
 
    <input type="button" value="Stop" onclick="sendStop()"> 
 
    <input type="button" value="Restart" onclick="sendRestart()"> 
 
</form> 
 
<p id="miParrafo"></p>