JavaScript 设置超时

JavaScript 可以通过设置超时来限制某个操作，例如在规定时间内等待异步请求的响应。本文将介绍如何在 JavaScript 中设置超时。

使用 setTimeout 函数

JavaScript 的 setTimeout 函数允许您在执行一些代码之前等待指定的时间。您可以使用它来设置超时。

const timeout = 5000; // 5 秒
let timer;

function foo() {
    // 执行某些操作
}

function startTimer() {
    timer = setTimeout(function() {
        console.log('超时！');
        // 在超时后执行某些操作
    }, timeout);
}

function stopTimer() {
    clearTimeout(timer);
}

在上面的代码中，startTimer 函数会在 5 秒后执行传递给 setTimeout 的函数。如果在 5 秒内调用了 stopTimer 函数，计时器就会被清除，函数将不会执行。

使用 Promise 和 setTimeout 函数

您还可以通过 Promise 和 setTimeout 函数来设置超时。

const timeout = 5000; // 5 秒

function foo() {
    return new Promise((resolve, reject) => {
        // 执行异步操作
        setTimeout(() => resolve('Done!'), timeout);
    });
}

function timeoutPromise(promise) {
    const timeoutPromise = new Promise((resolve, reject) => {
        setTimeout(() => {
            reject('超时！');
        }, timeout);
    });

    return Promise.race([promise, timeoutPromise]);
}

timeoutPromise(foo()).then(result => {
    console.log(result); // 输出 'Done!'
}).catch(error => {
    console.log(error); // 输出 '超时！'
});

在上面的代码中，foo 函数会执行一些异步操作，通过在 Promise 中返回 setTimeout 函数，可以等待指定的时间后返回结果。然后，您可以使用 timeoutPromise 函数，该函数接收一个 Promise 并返回一个新的 Promise，该新 Promise 在传入的 Promise 或超时 Promise（计时器）中的任何一个解决后都将解决。

总结

通过设置超时，您可以限制某些操作所需的时间并确保不会无限期等待结果。您可以使用 setTimeout 函数或将其与 Promise 一起使用来实现这一点。