aboutsummaryrefslogtreecommitdiff
path: root/files/ko/web/javascript/reference/global_objects/promise/allsettled/index.html
blob: 5a9546e58c7bebc54769f4d44f906cef7f6b37d5 (plain)
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
---
title: Promise.allSettled()
slug: Web/JavaScript/Reference/Global_Objects/Promise/allSettled
translation_of: Web/JavaScript/Reference/Global_Objects/Promise/allSettled
browser-compat: html.elements.allSettled
---
<p>{{JSRef}}</p>

<p><code><strong>Promise.allSettled()</strong></code> 메서드는 주어진 모든 프로미스를 이행하거나 거부한 후, 각 프로미스에 대한 결과를 나타내는 객체 배열을 반환합니다.</p>

<p>일반적으로 서로의 성공 여부에 관련 없는 여러 비동기 작업을 수행해야 하거나, 항상 각 프로미스의 실행 결과를 알고 싶을 때 사용합니다.</p>

<p>그에 비해, {{jsxref("Promise.all()")}}이 반환한 프로미스는 서로 연관된 작업을 수행하거나, 하나라도 거부 당했을 때 즉시 거부하고 싶을 때 적합합니다.</p>

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

<h2 id="syntax">문법</h2>

<pre class="syntaxbox"><em>Promise</em>.allSettled(<em>iterable</em>);</pre>

<h3 id="parameters">인자</h3>

<dl>
 <dt><code>iterable</code></dt>
 <dd>멤버가 모두 <code>Promise</code>인, 배열({{jsxref("Array")}})과 같은 <a href="ko/docs/Web/JavaScript/Reference/Iteration_protocols">이터러블</a> 객체입니다.</dd>
</dl>

<h3 id="return_value">반환 값</h3>

<p>지정된 Promise 컬렉션의 모든 Promise가 성공적으로 이행되거나 거부되어 완료되면, <strong>보류 중</strong>인 Promise는 <strong>비동기적</strong>으로 이행됩니다. 그 때, 반환된 Promise의 핸들러는 원래 프로미스 집합에 있는 각 프로미스의 결과를 포함하는 배열을 입력으로 전달합니다.</p>

<p>단, <code>Promise.allSettled()</code>는 빈 이터러블 객체를 인자로 전달받았을 <strong>경우에만</strong> 빈 배열로써 <strong>이미 이행된</strong> 객체를 반환합니다.</p>

<p>반환된 각 객체별로 <code>status</code>를 확인할 수 있습니다. 만약 <code>fulfilled</code> 상태라면 <code>value</code>를, <code>rejected</code> 상태라면면 <code>reason</code> 속성을 확인할 수 있습니다. value나 reason을 통해 각 Promise가 어떻게 이행(또는 거부)됐는지 알 수 있습니다.</p>

<h2 id="examples">예제</h2>

<h3 id="using_promise.allSettled">Promise.allSettled의 사용</h3>

<h4>{{jsxref("Promise.then", "Promise.prototype.then()")}}</h4>

<pre class="brush: js">
Promise.allSettled([
  Promise.resolve(33),
  new Promise(resolve => setTimeout(() => resolve(66), 0)),
  99,
  Promise.reject(new Error('an error'))
])
.then(values => console.log(values));

// [
//   {status: "fulfilled", value: 33},
//   {status: "fulfilled", value: 66},
//   {status: "fulfilled", value: 99},
//   {status: "rejected",  reason: Error: an error}
// ]
</pre>

<h4>{{jsxref("Operators/await", "await")}}</h4>

<pre class="brush: js">
const values = await Promise.allSettled([
  Promise.resolve(33),
  new Promise(resolve => setTimeout(() => resolve(66), 0)),
  99,
  Promise.reject(new Error('an error'))
])
console.log(values)

// [
//   {status: "fulfilled", value: 33},
//   {status: "fulfilled", value: 66},
//   {status: "fulfilled", value: 99},
//   {status: "rejected",  reason: Error: an error}
// ]
</pre>

<h2 id="specifications">명세</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://tc39.es/proposal-promise-allSettled/#sec-promise.allsettled"><code>Promise.allSettled()</code> (TC39 Stage 4 Draft)</a></td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="browser_compatibility">브라우저 호환성</h2>

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

<h2 id="see_also">같이 보기</h2>

<ul>
 <li><a href="https://github.com/zloirock/core-js#ecmascript-promise">core-js</a>에서 사용가능한 <code>Promise.allSettled</code>의 폴리필</li>
 <li><a href="/en-US/docs/Archive/Add-ons/Techniques/Promises">Promises</a></li>
 <li><a href="/en-US/docs/Web/JavaScript/Guide/Using_promises">Using promises</a></li>
 <li><a href="/en-US/docs/Learn/JavaScript/Asynchronous/Promises">Graceful asynchronous programming with promises</a></li>
 <li>{{jsxref("Promise")}}</li>
 <li>{{jsxref("Promise.all()")}}</li>
</ul>