Promise.race() 方法适用于多种场景，下面为你详细介绍几个典型场景：
1. 实现超时控制
在实际开发中，有时候我们发起的异步请求可能会因为网络状况不佳或者服务器响应缓慢而长时间得不到结果，这时就可以使用 Promise.race() 为请求设置一个超时时间。当请求超过设定的时间还未完成时，就认为请求超时。
function fetchData() {
return new Promise((resolve) => {
// 模拟一个耗时的异步请求
setTimeout(() => {
resolve('数据已获取');
}, 3000);
});
}
function timeout(ms) {
return new Promise((_, reject) => {
setTimeout(() => {
reject(new Error('请求超时'));
}, ms);
});
}
Promise.race([fetchData(), timeout(2000)])
.then((result) => {
console.log(result);
})
.catch((error) => {
console.error(error.message);
});
在这个例子里，fetchData() 模拟了一个耗时的异步请求，timeout(2000) 则设置了一个 2 秒的超时时间。通过 Promise.race() 并行执行这两个 Promise，如果 2 秒内 fetchData() 没有完成，timeout(2000) 就会率先失败，从而触发 catch 回调，提示请求超时。
2. 多个数据源竞争
当你有多个数据源可以获取相同类型的数据时，为了提高响应速度，可以同时从多个数据源发起请求，然后使用 Promise.race() 来获取最先返回结果的数据源的数据。
function getDataFromSource1() {
return new Promise((resolve) => {
setTimeout(() => {
resolve('来自数据源 1 的数据');
}, 2000);
});
}
function getDataFromSource2() {
return new Promise((resolve) => {
setTimeout(() => {
resolve('来自数据源 2 的数据');
}, 1000);
});
}
Promise.race([getDataFromSource1(), getDataFromSource2()])
.then((data) => {
console.log('获取到的数据:', data);
})
.catch((error) => {
console.error('获取数据失败:', error);
});
在这个例子中，getDataFromSource1() 和 getDataFromSource2() 分别模拟从两个不同数据源获取数据的异步操作。通过 Promise.race() 并行执行这两个 Promise，最终获取到的是率先返回结果的数据源的数据。
3. 快速响应验证
在进行某些验证操作时，可能有多种验证方式，每种验证方式的耗时不同。你可以同时发起多个验证操作，使用 Promise.race() 来获取最先完成验证的结果。
function validateWithMethod1() {
return new Promise((resolve) => {
setTimeout(() => {
resolve('验证方法 1 通过');
}, 1500);
});
}
function validateWithMethod2() {
return new Promise((resolve) => {
setTimeout(() => {
resolve('验证方法 2 通过');
}, 1000);
});
}
Promise.race([validateWithMethod1(), validateWithMethod2()])
.then((result) => {
console.log(result);
})
.catch((error) => {
console.error('验证失败:', error);
});
在这个例子中，validateWithMethod1() 和 validateWithMethod2() 分别模拟两种不同的验证方式。使用 Promise.race() 并行执行这两个 Promise，可以快速得到最先完成验证的结果。
综上所述，当你需要在多个异步操作中获取最先完成的结果，或者需要对异步操作设置超时控制时，Promise.race() 是一个非常合适的选择。
