1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
|
---
title: Promise.all()
slug: Web/JavaScript/Reference/Global_Objects/Promise/all
tags:
- ECMAScript 2015
- JavaScript
- Méthode
- Promise
translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all
---
<div>{{JSRef}}</div>
<p>Die <code><strong>Promise.all(iterable)</strong></code> Methode gibt einen {{jsxref("Promise")}} zurück, welcher erfüllt(<em>resolved)</em> wird, wenn alle Promises in dem <em>iterable </em>- Argument erfüllt wurden oder wenn das <em>iterable</em> - Argument keine Promises enthält. Eine Ablehnung (<em>reject</em>) erfolgt mit dem Grund des ersten Promises, das abgelehnt wurde, oder mit dem Error der von dem ersten Argument, wenn das innerhalb eines try/catch/throw blocks gefangen wurde.</p>
<p>Es wird typischerweise für mehrere asynchrone Aufgaben die parallel laufen und die Promises als Ergebnisse haben, so das eines warten kann, bis alle anderen Aufgaben abgeschlossen sind.</p>
<div>{{EmbedInteractiveExample("pages/js/promise-all.html")}}</div>
<p class="hidden">Die Quellen für diese interaktive Demo sind in einem GitHub Repository gespeichert. Wenn Du etwas zum interaktiven Demo Projekt beitragen willst, klone das Repository <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> und schicke uns einen pull request.</p>
<h2 id="Syntax">Syntax</h2>
<pre class="syntaxbox">Promise.all(<var>iterable</var>);</pre>
<h3 id="Parameter">Parameter</h3>
<dl>
<dt>iterable</dt>
<dd>Ein <a href="/en-US/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">iterierbares</a> Objekt, z.B. ein {{jsxref("Array")}} oder ein {{jsxref("String")}}.</dd>
</dl>
<h3 id="Rückgabe-Wert">Rückgabe-Wert</h3>
<ul>
<li>Ein <strong>bereits eingelöstes</strong> {{jsxref("Promise")}}, wenn das eingegebene <em>iterable</em> - Argument leer ist.</li>
<li>Ein <strong>asynchron eingelöstes</strong> {{jsxref("Promise")}}, wenn das eingegebene <em>iterable</em> - Argument keine Promises enthält. Achtung, Google Chrome 58 gibt in diesem Fall ein <strong>bereits eingelöstes</strong> Promise zurück.</li>
<li>Ein <strong>ausstehendes</strong> (<em>pending</em>) {{jsxref("Promise")}} in allen anderen Fällen. Dieses zurückgegebene Promise wird dann <strong>asynchron</strong> erfüllt/abgelehnt (sobald der <em>stack</em> leer ist), wenn alle Promises des gegebenen <em>iterable</em> erfüllt wurden, oder wenn irgendeiner der Promises abgelehnt wird. Die Rückgabewerte entsprechen dann der Reihenfolge der Promises, unabhängig von der Reihenfolge der Erfüllung.</li>
</ul>
<h2 id="Beschreibung">Beschreibung</h2>
<p>Diese Methode dient dem Bündeln von mehreren Promises.</p>
<p>Erfüllt: <br>
Wenn alle Promises erfolgreich erfüllt werden, oder keine Promises sind, wird <code>Promise.all</code> mit einem Array, welches die Rückgabewerte der einzelnen Promises (aber auch die nicht-Promise Werte) enthält, erfüllt. Wenn ein leeres Array übergeben wird, wird <code>Promise.all</code> (synchron) sofort erfüllt. </p>
<p>Abgelehnt:<br>
Wenn eines der übergebenen Promises abgelehnt wird, wird <code>Promise.all</code> asynchron mit dem Wert des fehlgeschlagenen Promise abgelehnt, ganz egal, ob die anderen Promises erfolgreich waren oder nicht.</p>
<h2 id="Beispiele">Beispiele</h2>
<h3 id="Erfolgreich">Erfolgreich:</h3>
<pre class="brush: js">var p1 = Promise.resolve(3);
var p2 = 1337;
var p3 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'foo');
});
Promise.all([p1, p2, p3])
.then(values => {
console.log(values); // [3, 1337, "foo"]
});
</pre>
<h3 id="Sofortige_Ablehnung">Sofortige Ablehnung:</h3>
<pre class="brush: js">var p1 = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, 'one');
});
var p2 = new Promise((resolve, reject) => {
setTimeout(resolve, 2000, 'two');
});
var p3 = new Promise((resolve, reject) => {
setTimeout(resolve, 3000, 'three');
});
var p4 = new Promise((resolve, reject) => {
setTimeout(resolve, 4000, 'four');
});
var p5 = new Promise((resolve, reject) => {
reject('reject');
});
Promise.all([p1, p2, p3, p4, p5]).then(values => {
console.log(values);
}, reason => {
console.log(reason)
});
//From console:
//"reject"
//You can also use .catch
Promise.all([p1, p2, p3, p4, p5]).then(values => {
console.log(values);
}).catch(reason => {
console.log(reason)
});
//From console:
//"reject"
</pre>
<h2 id="Spezifikationen">Spezifikationen</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td><a href="https://github.com/domenic/promises-unwrapping">domenic/promises-unwrapping</a></td>
<td>Draft</td>
<td>Standardization work is taking place here.</td>
</tr>
<tr>
<td>{{SpecName('ES2015', '#sec-promise.all', 'Promise.all')}}</td>
<td>{{Spec2('ES2015')}}</td>
<td>Initial definition in an ECMA standard.</td>
</tr>
</tbody>
</table>
<h2 id="Browserkompatiblität">Browserkompatiblität</h2>
<p>{{Compat("javascript.builtins.Promise.all")}}</p>
<h2 id="Siehe_auch">Siehe auch</h2>
<ul>
<li>{{jsxref("Promise")}}</li>
<li>{{jsxref("Promise.race()")}}</li>
</ul>
|