path: root/files/de/web/javascript/reference/global_objects/promise/race/index.html

---
title: Promise.race()
slug: Web/JavaScript/Reference/Global_Objects/Promise/race
tags:
  - ECMAScript 2015
  - JavaScript
  - Method
  - Promise
translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race
---
<div>{{JSRef}}</div>

<p><code><strong>Promise.race(iterable)</strong></code> gibt ein erfolgreiches oder fehlgeschlagenes Promise zurück, sobald eines der Promises in dem <code>iterable</code> erfolgreich war oder fehlgeschlagen ist, entsprechend mit dem <code>value</code> oder dem <code>reason</code> dieses Promises.</p>

<div>{{EmbedInteractiveExample("pages/js/promise-race.html")}}</div>

<p class="hidden">Der Code für das interaktive Demo ist in einem GitHub Repository zu finden. Sollten Sie bei diesem interaktiven Demo Projekt mitmachen wollen, dann klonen Sie <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> und senden uns einen Pull Request.</p>

<h2 id="Syntax">Syntax</h2>

<pre class="syntaxbox"><var>Promise.race(iterable)</var>;</pre>

<h3 id="Parameter">Parameter</h3>

<dl>
 <dt>iterable</dt>
 <dd>Ein iterierbares Objekt, wie zum Beispiel {{jsxref("Array")}}. Siehe auch <a href="/en-US/docs/Web/JavaScript/Guide/iterable">iterable</a>.</dd>
</dl>

<h3 id="Rückgabewert">Rückgabewert</h3>

<p>Eine {{jsxref("Promise")}} im Status <strong>pending</strong>, die <strong>asynchron</strong> (sobald der Stack leer ist) einen erfolgreichen oder fehlerhaften Status annimmt, sobald die erste Promise erfolgreich, bzw. fehlerhaft ist und entsprechend diesen Wert zurückliefert.</p>

<h2 id="Beschreibung">Beschreibung</h2>

<p>Die <code>race</code> Funktion gibt eine <code>Promise</code> zurück, die sich genauso verhält, wie die Promise aus <code>iterable</code>, die als erstes einen erfolgreichen oder fehlerhaften Status annimmt und entsprechend diesen Wert zurückliefert.</p>

<p>Wenn das übergebene <code>iterable</code> leer ist, wird die Promise für immer im Status <strong>pending</strong> verharren.</p>

<p>Wenn <code>iterable</code> einen oder mehrere Werte enthält, die keine Promise sind bzw. Promises die bereits einen erfolgreichen oder fehlerhaften Status angenommen haben, dann wird die zurückgegebene Promise von <code>Promise.race</code> entsprechend den ersten dieser Werte aus <code>iterable</code> annehmen.</p>

<h2 id="Beispiele"> Beispiele</h2>

<h3 id="Asynchronität_von_Promise.race"><font face="consolas, Liberation Mono, courier, monospace">Asynchronität von <code>Promise.race</code></font></h3>

<p>Das folgende Beispiel demonstriert the Asynchronität von <code>Promise.race:</code></p>

<pre class="brush: js">// wir übergeben als Argument ein Array von Promises, die bereits einen
// erfolgreichen Status angenommen haben, um Promise.race sofort auszulösen
var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];

var p = Promise.race(resolvedPromisesArray);
// sofortiges Loggen des Wertes aus p
console.log(p);

// mit setTimeout wird der Code erst nachdem der Stack leer ist ausgeführt
setTimeout(function(){
    console.log('der Stack ist jetzt leer');
    console.log(p);
});

// Logs, in der Reihenfolge:
// Promise { &lt;state&gt;: "pending" }
// der Stack ist jetzt leer
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: 33 }</pre>

<p>Ein leeres <code>iterable</code> führt zu einer Promise, die für immer im Status <strong>pending</strong> bleibt:</p>

<pre class="brush: js">var foreverPendingPromise = Promise.race([]);
console.log(foreverPendingPromise);
setTimeout(function(){
    console.log('der Stack ist jetzt leer');
    console.log(foreverPendingPromise);
});

// Logs, in der Reihenfolge:
// Promise { &lt;state&gt;: "pending" }
// der Stack ist jetzt leer
// Promise { &lt;state&gt;: "pending" }
</pre>

<p>Wenn <code>iterable</code> einen oder mehrere Werte enthält, die keine Promise sind bzw. Promises die bereits einen erfolgreichen oder fehlerhaften Status angenommen haben, dann wird <code>Promise.race</code> entsprechend den ersten dieser Werte aus <code>iterable</code> annehmen:</p>

<pre class="brush: js">var foreverPendingPromise = Promise.race([]);
var alreadyResolvedProm = Promise.resolve(666);

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

console.log(p);
console.log(p2);
setTimeout(function(){
    console.log('der Stack ist jetzt leer');
    console.log(p);
    console.log(p2);
});

// Logs, in der Reihenfolge:
// Promise { &lt;state&gt;: "pending" }
// Promise { &lt;state&gt;: "pending" }
// der Stack ist jetzt leer
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: 666 }
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: "keine Promise" }
</pre>

<h3 id="Benutzung_von_Promise.race_–_Beispiele_mit_setTimeout">Benutzung von <code>Promise.race</code> – Beispiele mit <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout"><code>setTimeout</code></a></h3>

<pre class="brush: js">var p1 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 500, 'eins');
});
var p2 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 100, 'zwei');
});

Promise.race([p1, p2]).then(function(value) {
  console.log(value); // "zwei"
  // beide erfolgreich, aber p2 ist schneller
});

var p3 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 100, 'drei');
});
var p4 = new Promise(function(resolve, reject) {
    setTimeout(reject, 500, 'vier');
});

Promise.race([p3, p4]).then(function(value) {
  console.log(value); // "drei"
  // p3 ist schneller, also insgesamt erfolgreich
}, function(reason) {
  // nicht aufgerufen
});

var p5 = new Promise(function(resolve, reject) {
    setTimeout(resolve, 500, 'fünf');
});
var p6 = new Promise(function(resolve, reject) {
    setTimeout(reject, 100, 'sechs');
});

Promise.race([p5, p6]).then(function(value) {
  // nicht aufgerufen
}, function(reason) {
  console.log(reason); // "sechs"
  // p6 ist schneller, also insgesamt fehlerhaft
});
</pre>

<h2 id="Spezifikationen">Spezifikationen</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Spezifikation</th>
   <th scope="col">Status</th>
   <th scope="col">Kommentar</th>
  </tr>
  <tr>
   <td>{{SpecName('ES2015', '#sec-promise.race', 'Promise.race')}}</td>
   <td>{{Spec2('ES2015')}}</td>
   <td>Initiale Definition eines ECMA Standards.</td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Browserkompatibilität">Browserkompatibilität</h2>

<p>{{Compat("javascript.builtins.Promise.race")}}</p>

<h2 id="Siehe_auch">Siehe auch</h2>

<ul>
 <li>{{jsxref("Promise")}}</li>
 <li>{{jsxref("Promise.all()")}}</li>
</ul>