この翻訳は不完全です。英語から この記事を翻訳 してください。

Promise.race(iterable) 静的メソッドは、引数で渡された iterable 内の、最初に成功もしくは失敗した promise に対し、その状態を反映する promise を返します。

構文

Promise.race(iterable);

引数

iterable
Array のような反復オブジェクト。iterable を確かめて下さい。

返値

pending Promise that asynchronously yields the value of the first promise in the given iterable to resolve or reject.

説明

The race function returns a Promise that is settled the same way (and takes the same value) as the first promise that settles amongst the promises of the iterable passed as an argument.

渡された iterable が空の場合、返される promise はずっと pending のままです。

If the iterable contains one or more non-promise value and/or an already resolved/rejected promise, then Promise.race will resolve to the first of these values found in the iterable.

Asynchronicity of Promise.race

This following example demonstrates the asynchronicity of Promise.race:

// we are passing as argument an array of promises that are already resolved,
// to trigger Promise.race as soon as possible
var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];

var p = Promise.race(resolvedPromisesArray);
// immediately logging the value of p
console.log(p);

// using setTimeout we can execute code after the stack is empty
setTimeout(function(){
    console.log('the stack is now empty');
    console.log(p);
});

// logs, in order:
// Promise { <state>: "pending" }
// the stack is now empty
// Promise { <state>: "fulfilled", <value>: 33 }

An empty iterable causes the returned promise to be forever pending:

var foreverPendingPromise = Promise.race([]);
console.log(foreverPendingPromise);
setTimeout(function(){
    console.log('the stack is now empty');
    console.log(foreverPendingPromise);
});

// logs, in order:
// Promise { <state>: "pending" }
// the stack is now empty
// Promise { <state>: "pending" }

If the iterable contains one or more non-promise value and/or an already resolved/rejected promise, then Promise.race will resolve to the first of these values found in the array:

var foreverPendingPromise = Promise.race([]);
var alreadyResolvedProm = Promise.resolve(666);

var arr = [foreverPendingPromise, alreadyResolvedProm, "non-Promise value"];
var arr2 = [foreverPendingPromise, "non-Promise value", Promise.resolve(666)];
var p = Promise.race(arr);
var p2 = Promise.race(arr2);

console.log(p);
console.log(p2);
setTimeout(function(){
    console.log('the stack is now empty');
    console.log(p);
    console.log(p2);
});

// logs, in order:
// Promise { <state>: "pending" } 
// Promise { <state>: "pending" } 
// the stack is now empty
// Promise { <state>: "fulfilled", <value>: 666 }
// Promise { <state>: "fulfilled", <value>: "non-Promise value" }

Promise.race を使う– setTimeout と使う例

var p1 = new Promise(function(resolve, reject) { 
    setTimeout(() => resolve('one'), 500); 
});
var p2 = new Promise(function(resolve, reject) { 
    setTimeout(() => resolve('two'), 100); 
});

Promise.race([p1, p2])
.then(function(value) {
  console.log(value); // "two"
  // Both resolve, but p2 is faster
});

var p3 = new Promise(function(resolve, reject) { 
    setTimeout(() => resolve('three'), 100);
});
var p4 = new Promise(function(resolve, reject) { 
    setTimeout(() => reject(new Error('four')), 500); 
});

Promise.race([p3, p4])
.then(function(value) {
  console.log(value); // "three"
  // p3 is faster, so it resolves
}, function(reason) {
  // Not called
});

var p5 = new Promise(function(resolve, reject) { 
    setTimeout(() => resolve('five'), 500); 
});
var p6 = new Promise(function(resolve, reject) { 
    setTimeout(() => reject(new Error('six')), 100);
});

Promise.race([p5, p6])
.then(function(value) {
  // Not called
}, function(error) {
  console.log(error.message); // "six"
  // p6 is faster, so it rejects
});

仕様

仕様 状況 コメント
ECMAScript 2015 (6th Edition, ECMA-262)
Promise.race の定義
標準 Initial definition in an ECMA standard.
ECMAScript Latest Draft (ECMA-262)
Promise.race の定義
ドラフト  

ブラウザー実装状況

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
raceChrome 完全対応 32Edge 完全対応 12Firefox 完全対応 29IE 未対応 なしOpera 完全対応 19Safari 完全対応 8WebView Android 完全対応 4.4.3Chrome Android 完全対応 32Edge Mobile 完全対応 ありFirefox Android 完全対応 29Opera Android 完全対応 ありSafari iOS 完全対応 8Samsung Internet Android 完全対応 ありnodejs 完全対応 0.12

凡例

完全対応  
完全対応
未対応  
未対応

関連情報

ドキュメントのタグと貢献者

このページの貢献者: segayuu, mdnwebdocs-bot, SphinxKnight, yasuhiroki, shide55
最終更新者: segayuu,