path: root/files/ja/web/javascript/reference/global_objects/promise/all/index.html

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

<p><strong><code>Promise.all(<var>iterable</var>)</code></strong> メソッドは単一の {{jsxref("Promise")}} を返し、これは引数 <var>iterable</var> の中のすべての Promise が解決されるか、引数 <var>iterable</var> の中に Promise がない場合に解決されます。最初に拒否された Promise の拒否理由をもって拒否されます。</p>

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

<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p>

<h2 id="Syntax" name="Syntax">構文</h2>

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

<h3 id="Parameters" name="Parameters">引数</h3>

<dl>
 <dt><var>iterable</var></dt>
 <dd>{{jsxref("Array")}} や {{jsxref("String")}} のような<ruby><a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols#The_iterable_protocol">反復処理可能</a><rp> (</rp><rt>iterable</rt><rp>) </rp></ruby>なオブジェクト。</dd>
</dl>

<h3 id="Return_value" name="Return_value">返値</h3>

<ul>
 <li>渡した <var>iterable</var> が空の場合、<strong>解決済み</strong>の {{jsxref("Promise")}}。</li>
 <li>渡した <var>iterable</var> に Promise がない場合、<strong>非同期に解決した</strong> {{jsxref("Promise")}}。ただし、 Google Chrome 58 ではこの場合。<strong>すでに解決した</strong> Promise を返す。</li>
 <li>その他の場合は<strong>待ち状態</strong>の {{jsxref("Promise")}} 。この返却される promise は次に、 <var>iterable</var> として与えられたすべての Promise が解決するか、すべての Promise が拒否されると<strong>非同期に</strong> (スタックが空になるとすぐに) 解決/拒否されます。以下の「Promise.all の非同期性・同期性」の例を見てください。返値は、実行完了の順とは関係なく、 Promise が渡された順に並びます。</li>
</ul>

<h2 id="Description" name="Description">解説</h2>

<p>このメソッドは複数の Promise の結果を集約するのに便利です。</p>

<p>完成:<br>
 空の <var>iterable</var> が渡された場合、このメソッドはすでに解決した Promise を (同期的に) 返します。<br>
 渡された Promise のすべてが満たされるか、 Promise が渡されていない場合、 <code>Promise.all</code> によって返される Promise が非同期的に完成されます。<br>
 すべての場合で、返された Promise は、引数として渡された <var>iterable</var> の<strong>すべての</strong>値 (Promise ではない値も) を含んだ配列で完成されます。</p>

<p>拒否:<br>
 渡された Promise のいずれかが拒否されたら、 <code>Promise.all</code> は非同期的に、その他の Promise が完了しているかどうかに関係なく、その拒否した Promise の値で拒否されます。</p>

<h2 id="Examples" name="Examples">例</h2>

<h3 id="Using_Promise.all" name="Using_Promise.all"><code>Promise.all</code> の使用</h3>

<p><code>Promise.all</code>はすべての完成 (または最初の拒否) を待ちます。</p>

<pre class="brush: js">var p1 = Promise.resolve(3);
var p2 = 1337;
var p3 = new Promise((resolve, reject) =&gt; {
  setTimeout(() =&gt; {
    resolve("foo");
  }, 100);
});

Promise.all([p1, p2, p3]).then(values =&gt; {
  console.log(values); // [3, 1337, "foo"]
});</pre>

<p><var>iterable</var> に Promise ではない値が含まれる場合は無視されますが、 (Promise が成功する場合) 返される Promise 配列の値にはカウントされます。</p>

<pre class="brush: js">// this will be counted as if the iterable passed is empty, so it gets fulfilled
var p = Promise.all([1,2,3]);
// this will be counted as if the iterable passed contains only the resolved promise with value "444", so it gets fulfilled
var p2 = Promise.all([1,2,3, Promise.resolve(444)]);
// this will be counted as if the iterable passed contains only the rejected promise with value "555", so it gets rejected
var p3 = Promise.all([1,2,3, Promise.reject(555)]);

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

// logs
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: Array[3] }
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: Array[4] }
// Promise { &lt;state&gt;: "rejected", &lt;reason&gt;: 555 }</pre>

<h3 id="Promise.all_の非同期性・同期性"><code>Promise.all</code> の非同期性・同期性</h3>

<p>以下の例では <code>Promise.all</code> の非同期性 (または渡されたiterable が空の場合、同期性) を実演します。</p>

<pre class="brush: js">// we are passing as argument an array of promises that are already resolved,
// to trigger Promise.all as soon as possible
var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)];

var p = Promise.all(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 { &lt;state&gt;: "pending" }
// the stack is now empty
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: Array[2] }
</pre>

<p><code>Promise.all</code> が拒否されたときも同じことが起きます.。</p>

<pre class="brush: js">var mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)];
var p = Promise.all(mixedPromisesArray);
console.log(p);
setTimeout(function() {
    console.log('the stack is now empty');
    console.log(p);
});

// logs
// Promise { &lt;state&gt;: "pending" }
// the stack is now empty
// Promise { &lt;state&gt;: "rejected", &lt;reason&gt;: 44 }
</pre>

<p>しかし、<code>Promise.all</code> は渡された <var>iterable</var> が空の<strong>場合だけ</strong>同期的に解決します。</p>

<pre class="brush: js">var p = Promise.all([]); // will be immediately resolved
var p2 = Promise.all([1337, "hi"]); // non-promise values will be ignored, but the evaluation will be done asynchronously
console.log(p);
console.log(p2)
setTimeout(function() {
    console.log('the stack is now empty');
    console.log(p2);
});

// logs
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: Array[0] }
// Promise { &lt;state&gt;: "pending" }
// the stack is now empty
// Promise { &lt;state&gt;: "fulfilled", &lt;value&gt;: Array[2] }
</pre>

<h3 id="Promise.all_fail-fast_behaviour" name="Promise.all_fail-fast_behaviour"><code>Promise.all</code>のフェイルファストの挙動</h3>

<p><code>Promise.all</code> は要素のひとつでも拒否されると拒否します。例えば、タイムアウト後に4つの Promise が解決しても、1つの Promise が直ちに拒否された場合、 <code>Promise.all</code> は直ちに拒否します。</p>

<pre class="brush: js">var p1 = new Promise((resolve, reject) =&gt; {
  setTimeout(() =&gt; resolve('one'), 1000);
});
var p2 = new Promise((resolve, reject) =&gt; {
  setTimeout(() =&gt; resolve('two'), 2000);
});
var p3 = new Promise((resolve, reject) =&gt; {
  setTimeout(() =&gt; resolve('three'), 3000);
});
var p4 = new Promise((resolve, reject) =&gt; {
  setTimeout(() =&gt; resolve('four'), 4000);
});
var p5 = new Promise((resolve, reject) =&gt; {
  reject(new Error('reject'));
});


// Using .catch:
Promise.all([p1, p2, p3, p4, p5])
.then(values =&gt; {
  console.log(values);
})
.catch(error =&gt; {
  console.log(error.message)
});

//From console:
//"reject"

</pre>

<p>この動作は失敗する可能性を制御することで変更することができます。</p>

<pre class="brush: js">var p1 = new Promise((resolve, reject) =&gt; {
  setTimeout(() =&gt; resolve('p1_delayed_resolvement'), 1000);
});

var p2 = new Promise((resolve, reject) =&gt; {
  reject(new Error('p2_immediate_rejection'));
});

Promise.all([
  p1.catch(error =&gt; { return error }),
  p2.catch(error =&gt; { return error }),
]).then(values =&gt; {
  console.log(values[0]) // "p1_delayed_resolvement"
  console.log(values[1]) // "Error: p2_immediate_rejection"
})
</pre>

<h2 id="Specifications" name="Specifications">仕様書</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">仕様書</th>
   <th scope="col">状態</th>
   <th scope="col">備考</th>
  </tr>
  <tr>
   <td>{{SpecName('ES2015', '#sec-promise.all', 'Promise.all')}}</td>
   <td>{{Spec2('ES2015')}}</td>
   <td>ECMA 標準としての初回定義</td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの対応</h2>

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

<h2 id="See_also" name="See_also">関連情報</h2>

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