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
|
---
title: Promise.prototype.then()
slug: Web/JavaScript/Reference/Global_Objects/Promise/then
tags:
- ECMAScript6
- JavaScript
- Method
- Promise
- Prototype
- Referensi
translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then
---
<div>{{JSRef}}</div>
<p>Method <code><strong>then()</strong></code> mengembalikan {{domxref("Promise")}}. Menggunakan dua argumen: fungsi callback untuk kasus sukses dan gagal pada <code>Promise</code>.</p>
<h2 id="Sintaks">Sintaks</h2>
<pre class="syntaxbox"><var>p.then(onFulfilled, onRejected)</var>;
p.then(function(value) {
// fulfillment
}, function(reason) {
// rejection
});
</pre>
<h3 id="Parameter">Parameter</h3>
<dl>
<dt><code>onFulfilled</code></dt>
<dd>{{jsxref("Function")}} dipanggil ketika <code>Promise</code> dipenuhi. Fungsi ini memiliki satu argumen, <code>value pemenuhan</code>.</dd>
<dt><code>onRejected</code></dt>
<dd>{{jsxref("Function")}} dipangil ketika <code>Promise</code> ditolak. fungsi ini memiliki satau argumen, alasan penolakan.</dd>
</dl>
<h2 id="Deskripsi">Deskripsi</h2>
<p>Kedua method <code>then</code> dan {{jsxref("Promise.prototype.catch()")}} megembalikan promis, juga dapat dirantaikan — operasi yang disebut <em>composition</em>.</p>
<h2 id="Contoh">Contoh</h2>
<h3 id="Meggunakan_method_then">Meggunakan method <code>then</code></h3>
<pre class="brush: js">var p1 = new Promise(function(resolve, reject) {
resolve("Success!");
// or
// reject ("Error!");
});
p1.then(function(value) {
console.log(value); // Success!
}, function(reason) {
console.log(reason); // Error!
});
</pre>
<h3 id="Perantaian">Perantaian</h3>
<p>Karena method <code>then</code> mengembalikan <code>Promise</code>, anda bisa merantaikan pemanggilan <code>then</code>.</p>
<pre class="brush: js">var p2 = new Promise(function(resolve, reject) {
resolve(1);
});
p2.then(function(value) {
console.log(value); // 1
return value + 1;
}).then(function(value) {
console.log(value); // 2
});
p2.then(function(value) {
console.log(value); // 1
});
</pre>
<p>Anda juga bisa menggunakan perantaian untuk melaksanakan satu fungsi dengan sebuah Promise berbasis API diatas fungsi lainnya.</p>
<pre class="brush: js">function fetch_current_data() {
// The <a href="/en-US/docs/Web/API/GlobalFetch/fetch">fetch</a>() API returns a Promise. This function
// exposes a similar API, except the fulfillment
// value of this function's Promise has had more
// work done on it.
return fetch("current-data.json").then((response) => {
if (response.headers.get("content-type") != "application/json") {
throw new TypeError();
}
var j = response.json();
// maybe do something with j
return j; // fulfillment value given to user of
// fetch_current_data().then()
});
}
</pre>
<h2 id="Spesifikasi">Spesifikasi</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Spesifikasi</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td>
<td>{{Spec2('ES6')}}</td>
<td>Initial definition in an ECMA standard.</td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="Kompabilitas_Browser">Kompabilitas Browser</h2>
<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p>
<p>{{Compat("javascript.builtins.Promise.then")}}</p>
<p> </p>
<h2 id="Lihat_juga">Lihat juga</h2>
<ul>
<li>{{jsxref("Promise")}}</li>
<li>{{jsxref("Promise.prototype.catch()")}}</li>
</ul>
|
