首页 >web前端 >js教程 >为什么在 Promise 链中使用 setTimeout 会破坏链,如何修复?

为什么在 Promise 链中使用 setTimeout 会破坏链,如何修复?

Patricia Arquette
Patricia Arquette原创
2024-10-29 02:48:021078浏览

Why does using setTimeout in a promise chain break the chain, and how can it be fixed?

在 Promise 链上使用 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 对象中。但是,由于 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中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn