メッセンジャーでsetTimeoutとPromisesを正しく使用する方法

Question

Messengerボットを介して一連のメッセージをいくつか送信し、タイピング効果を表示したいとします。

 sendTextMessage(recipientId, `Howdy ${snapshot.child("userDetails/firstName").val()}! I’m Marco :)`) 
     sendSenderAction(recipientId, "typing_on") 
     setTimeout(()=>sendTextMessage(recipientId, "Botting Marco."),1000) 
     sendSenderAction(recipientId, "typing_on") 
     setTimeout(()=>sendTextMessage(recipientId, "Let me show you some of my recent work. This is the first portfolio bot ever. (afaik) :p"),5000) 
     sendSenderAction(recipientId, "typing_on") 
     setTimeout(()=>sendTextMessage(recipientId, "How many minutes do you have?"),7000) 
     userRef.update({stage:1, class:1, awaiting: true}) 

しかし、タイピングの効果は、いくつかの理由で表示されません。現在、私はこのコードを持っています。前回の処理が完了したときに各行が実行されるように私は約束を使用する必要がありますか？私に例を教えてもらえますか？

Answer 1

これはFacebookにどのように統合されるのかよく分かりませんが、遅延した「タイピング」効果を得るには、文字を配列に入力してから遅延時間を長くするタイマーを使用しますループ。これを達成するための約束は必要ありません。

設定されたすべてのタイマーがイベントキューに「スタック」され、その結果すべてが速やかに連続して実行されるので、表示されるようにすばやくテキストが作成されるため、一斉に。各タイマーが以前のタイマーより長く待つことを確認する必要があります。ここで

は例です：

var out = document.getElementById("output"); 
 

 
var message = "This is the text to type..."; 
 

 
// Turn string into proper array so .forEach can be used 
 
var messageArray = Array.prototype.slice.call(message); 
 

 
// Set the initial stagger amount between timer calls 
 
var stagger = .5; 
 

 
messageArray.forEach(function(char){ 
 
    setTimeout(function(){ 
 
    out.textContent += char; 
 
    }, 250 * (stagger++)); // Each timer will have a longer delay on it than the last one 
 
});

<div id="output"></div>

自分のFacebookのユースケースにこれを適応させるために、あなただけのFacebook Messengerのボットとパスを呼び出してsetTimeout機能の内容を置き換えますそれに対する単一の文字。