title: How to wait until speech is finished inside Loop?
body: <p>I would like to halt/wait the for-loop until the <code>window.speechSynthesis.speak(audio)</code> finishes reading the text, then go to next iteration. I have below code:</p>
  
  <pre><code> var all = "Oak is strong and also gives shade \n \
      Cats and dogs each hate the other \n \
      The pipe began to rust while new \n Bye."
  
  
   sentences = all.split('\n')
        for (i = 0; i &lt; sentences.length; i++) {
          sentence = sentences[i]
          console.log(sentences[i]);
          audio = new SpeechSynthesisUtterance(sentence)
          window.speechSynthesis.speak(audio)
           } 
  </code></pre>
  
  <p>Now what I want is that, once each <code>sentences[i]</code> is printed. The next <code>sentences[i]</code> will not be printed until   <code>window.speechSynthesis.speak(audio)</code> is finished, once the speech is finished then the <code>sentences[i]</code>  will be printed for the next iteration.</p>
  
  <p>So how can I make the loop wait until a function is not finished?</p>
  
  <p><strong>Note:</strong> I can make it wait for a constant time, but I want a dynamic wait, i.e. the wait should be as long as<code>window.speechSynthesis.speak(audio)</code> takes time to finish the text.</p>