如何在Loop内部等待语音结束? [英] How to wait until speech is finished inside Loop?

问题描述

我想暂停/等待for循环，直到 window.speechSynthesis.speak(audio)完成阅读文本，然后转到下一个迭代.我有以下代码:

I would like to halt/wait the for-loop until the window.speechSynthesis.speak(audio) finishes reading the text, then go to next iteration. I have below 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 < sentences.length; i++) {
        sentence = sentences[i]
        console.log(sentences[i]);
        audio = new SpeechSynthesisUtterance(sentence)
        window.speechSynthesis.speak(audio)
         } 

现在我想要的是，一旦打印每个句子[i] .直到 window.speechSynthesis.speak(audio)完成后，下一个 sentences [i] 才会打印.将被打印以用于下一次迭代.

Now what I want is that, once each sentences[i] is printed. The next sentences[i] will not be printed until window.speechSynthesis.speak(audio) is finished, once the speech is finished then the sentences[i] will be printed for the next iteration.

那么如何让循环等待直到函数未完成?

So how can I make the loop wait until a function is not finished?

注意:我可以让它等待一个恒定的时间，但是我想要一个动态的等待，即等待应该与 window.speechSynthesis.speak(audio)一样长code>需要时间来完成文本.

Note: I can make it wait for a constant time, but I want a dynamic wait, i.e. the wait should be as long aswindow.speechSynthesis.speak(audio) takes time to finish the text.

推荐答案

对于 SpeechSynthesisUtterance API，有一个 onend 事件，您可以使用该事件((

For SpeechSynthesisUtterance API there is an onend event what you can play with (SpeechSynthesisUtterance: end event).

所以我想您可以在 onend 上添加一个事件侦听器，您需要在其中调用下一个迭代的代码.一种好的技术是在异步情况下使用 Promise 来等待回调完成.我从您的问题中为上述情况创建了一个有效的示例:

So I guess you can add an event listener to onend where you need to call the next iteration's code. One good technique is to use Promise in asynchronous cases to wait until a callback finishes. I have created a working example for the above case from your question:

(function() {
  play();

  async function play() {
    let 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 < sentences.length; i++) {
      await getNextAudio(sentences[i]);
    }

    async function getNextAudio(sentence) {
      console.log(sentence);
      let audio = new SpeechSynthesisUtterance(sentence);
      window.speechSynthesis.speak(audio);

      return new Promise(resolve => {
        audio.onend = resolve;
      });
    } 
  }
})();

如果您对更多详细信息感兴趣，请访问以下链接以进一步阅读:

If you are interested in more details, please go for the following links to read further:

1. 承诺
2. SpeechSynthesis.speak()
3. SpeechSynthesisUtterance.onend
4. 异步函数

该解决方案的工作原理就像魅力一样，希望对您有所帮助！

The solution works just like charm, hope this helps!

这篇关于如何在Loop内部等待语音结束?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！