ホームページ >ウェブフロントエンド >jsチュートリアル >Promise チェーンで setTimeout を使用するとチェーンが壊れるのはなぜですか?また、それを修正するにはどうすればよいですか?
Promise Chain での setTimeout の使用
Promise は非同期操作の順序付けを提供し、開発者がコールバック ベースのコードをあたかもそうであるかのように操作できるようにします。同期していました。ただし、Promise チェーン内の操作間に遅延を導入すると、課題が生じる可能性があります。
質問:
提供されたコード スニペットでは、setTimeout を使用して遅延が試行されていますが、結果はJSON 解析エラーです。これはなぜ発生しますか?また、どのように解決できますか?
<code class="javascript">... getLinks('links.txt').then(function(links){ let all_links = (JSON.parse(links)); globalObj=all_links; return getLinks(globalObj["one"]+".txt"); }).then(function(topic){ writeToBody(topic); setTimeout(function(){ return getLinks(globalObj["two"]+".txt"); // without setTimeout it works fine },1000); }); ...</code>
回答:
この問題は、setTimeout が Promise を返さないために発生します。デフォルトでは、Promise チェーンから値を返すと、その値は解決された Promise オブジェクトにラップされます。ただし、setTimeout はタイマー ID を返すため、Promise チェーンが壊れ、戻り値は Promise として扱われません。
この問題を解決するには、次のアプローチを使用できます。
1. Promise チェーンの外側に遅延関数を作成します:
setTimeout を使用する代わりに、Promise で遅延をラップする遅延関数を定義します:
<code class="javascript">function delay(t, val) { return new Promise(resolve => setTimeout(resolve, t, val)); }</code>
更新されたコード:
<code class="javascript">... getLinks('links.txt').then(function(links){ let all_links = (JSON.parse(links)); globalObj=all_links; return getLinks(globalObj["one"]+".txt"); }).then(function(topic){ writeToBody(topic); // return a promise here that will be chained to prior promise return delay(1000).then(function() { return getLinks(globalObj["two"]+".txt"); }); }); ...</code>
2. Promise オブジェクトに Delay メソッドを追加します:
より洗練された解決策は、遅延メソッドを使用して Promise オブジェクトを拡張することです:
<code class="javascript">Promise.prototype.delay = function(t) { return this.then(function(val) { return delay(t, val); }); }</code>
更新されたコード:
<code class="javascript">... getLinks('links.txt').then(function(links){ let all_links = (JSON.parse(links)); globalObj=all_links; return getLinks(globalObj["one"]+".txt"); }).then(function(topic){ writeToBody(topic); // return a promise using the delay method return Promise.resolve().delay(1000).then(function() { return getLinks(globalObj["two"]+".txt"); }); }); ...</code>
これらの手法を使用すると、チェーンの動作を損なうことなく、実行時エラーを回避することなく、Promise チェーンに遅延を導入できます。
以上がPromise チェーンで setTimeout を使用するとチェーンが壊れるのはなぜですか?また、それを修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。