那么如何在承诺中添加延迟[重复]答案

【问题标题】：How to add delay to promise inside then [duplicate]那么如何在承诺中添加延迟[重复]
【发布时间】：2016-12-21 17:17:05
【问题描述】：

fetch() {   
    return axios.get('/rest/foo')
        //.then(response => {throw new Error(response)}) // Uncomment to test network error
        //.then( <<add delay here>> ) // Uncomment to simulate network delay
}

如何在后者中添加延迟然后阻塞，以便在将控制权传递给 fetch 调用者然后阻塞之前等待指定的时间量？

【问题讨论】：

标签： javascript asynchronous callback promise

【解决方案1】：

从等待的 then 处理程序返回一个承诺：

.then(() => new Promise(resolve => setTimeout(resolve, 1000)))

如果你想“传递”promise的值，那么

.then(x => new Promise(resolve => setTimeout(() => resolve(x), 1000)))

为了避免到处出现这种样板，编写一个实用函数：

function sleeper(ms) {
  return function(x) {
    return new Promise(resolve => setTimeout(() => resolve(x), ms));
  };
}

然后像 in 一样使用它

.then(sleeper(1000)).then(...)

【讨论】：

感谢您的解决方案，对我的情况进行了细微修改，效果很好：在异步函数中，您可以写：await new Promise(resolve => setTimeout(resolve, 1000))
从 Node.js 16 开始，也可以使用Timers Promises API。

【解决方案2】：

这是您创建新承诺的罕见情况之一：

fetch() {   
    return axios.get('/rest/foo')
        .then(value => new Promise(resolve => {
                setTimeout(() => {
                    resolve(value);
                }, delayInMilliseconds);
            })
        );
}

但不是一次性的，我有（事实上，确实有）一个实用功能：

function wait(ms, value) {
    return new Promise(resolve => setTimeout(resolve, ms, value));
}

然后：

fetch() {   
    return axios.get('/rest/foo')
        .then(value => wait(delayInMilliseconds, value));
}

这是带有 TypeScript 类型的 wait（感谢 MEMark！）：

function wait<T>(ms: number, value: T) {
    return new Promise<T>((resolve) => setTimeout(resolve, ms, value));
}

【讨论】：

使用 TypeScript 类型：function wait<T>(ms: number, value: T) { return new Promise<T>((resolve) => setTimeout(resolve, ms, value)); }