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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
|
---
title: Promise.prototype.catch()
slug: Web/JavaScript/Reference/Global_Objects/Promise/catch
tags:
- EMCAScript 2015
- JavaScript
- Method
- Promise
- Prototype
translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch
---
<div>{{JSRef}}</div>
<p><strong>catch()</strong> 方法只處理 Promise 的被拒絕狀態，並回傳一個新的 <code>Promise</code> 物件。此方法的行為等同於呼叫 {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}}。</p>
<h2 id="語法">語法</h2>
<pre class="syntaxbox"><var>p.catch(onRejected)</var>;
p.catch(function(reason) {
// rejection
});
</pre>
<h3 id="參數">參數</h3>
<dl>
<dt>onRejected</dt>
<dd>一個 {{jsxref("Function")}} ，在 <code>Promise</code> 被拒絕時被呼叫。這個函式有一個引數：
<dl>
<dt><code>reason</code></dt>
<dd>失敗訊息。</dd>
</dl>
若 onRejected 拋出一個錯誤或回傳一個被拒絕的 Promise，則 catch() 回傳的 Promise 被拒絕；其他情形都是被實現。</dd>
</dl>
<h3 id="回傳值">回傳值</h3>
<p>呼叫（<code>catch</code> 的 promise）物件，內部呼叫 <code>Promise.prototype.then</code>，傳入引數 undefined 及 onRejected；接著以之結果回傳（結果為 {{jsxref("Promise")}}）。</p>
<p><strong>內部呼叫演示：</strong></p>
<pre class="brush: js">// overriding original Promise.prototype.then/catch just to add some logs
(function(Promise){
var originalThen = Promise.prototype.then;
var originalCatch = Promise.prototype.catch;
Promise.prototype.then = function(){
console.log('> > > > > > called .then on %o with arguments: %o', this, arguments);
return originalThen.apply(this, arguments);
};
Promise.prototype.catch = function(){
console.log('> > > > > > called .catch on %o with arguments: %o', this, arguments);
return originalCatch.apply(this, arguments);
};
})(this.Promise);
// calling catch on an already resolved promise
Promise.resolve().catch(function XXX(){});
// logs:
// > > > > > > called .catch on Promise{} with arguments: Arguments{1} [0: function XXX()]
// > > > > > > called .then on Promise{} with arguments: Arguments{2} [0: undefined, 1: function XXX()]
</pre>
<h2 id="描述">描述</h2>
<p><code>catch</code> 方法在處理 promise 組合的錯誤時很有幫助。</p>
<h2 id="範例">範例</h2>
<h3 id="使用及串接_catch_方法">使用及串接 <code>catch</code> 方法</h3>
<pre class="brush: js">var p1 = new Promise(function(resolve, reject) {
resolve('Success');
});
p1.then(function(value) {
console.log(value); // "Success!"
throw 'oh, no!';
}).catch(function(e) {
console.log(e); // "oh, no!"
}).then(function(){
console.log('after a catch the chain is restored');
}, function () {
console.log('Not fired due to the catch');
});
// The following behaves the same as above
p1.then(function(value) {
console.log(value); // "Success!"
return Promise.reject('oh, no!');
}).catch(function(e) {
console.log(e); // "oh, no!"
}).then(function(){
console.log('after a catch the chain is restored');
}, function () {
console.log('Not fired due to the catch');
});
</pre>
<h3 id="拋出例外時的陷阱">拋出例外時的陷阱</h3>
<pre class="brush: js">// Throwing an error will call the catch method most of the time
var p1 = new Promise(function(resolve, reject) {
throw 'Uh-oh!';
});
p1.catch(function(e) {
console.log(e); // "Uh-oh!"
});
// Errors thrown inside asynchronous functions will act like uncaught errors
var p2 = new Promise(function(resolve, reject) {
setTimeout(function() {
throw 'Uncaught Exception!';
}, 1000);
});
p2.catch(function(e) {
console.log(e); // This is never called
});
// Errors thrown after resolve is called will be silenced
var p3 = new Promise(function(resolve, reject) {
resolve();
throw 'Silenced Exception!';
});
p3.catch(function(e) {
console.log(e); // This is never called
});</pre>
<h3 id="如果_Promise_被實現">如果 Promise 被實現</h3>
<pre class="brush: js">//Create a promise which would not call onReject
var p1 = Promise.resolve("calling next");
var p2 = p1.catch(function (reason) {
//This is never called
console.log("catch p1!");
console.log(reason);
});
p2.then(function (value) {
console.log("next promise's onFulfilled"); /* next promise's onFulfilled */
console.log(value); /* calling next */
}, function (reason) {
console.log("next promise's onRejected");
console.log(reason);
});</pre>
<h2 id="規範">規範</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>{{SpecName('ES2015', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td>
<td>{{Spec2('ES2015')}}</td>
<td>Initial definition in an ECMA standard.</td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>
<p>{{Compat("javascript.builtins.Promise.catch")}}</p>
<h2 id="參見">參見</h2>
<ul>
<li>{{jsxref("Promise")}}</li>
<li>{{jsxref("Promise.prototype.then()")}}</li>
</ul>
|
