Dalam tutorial ini, Anda akan belajar tentang promise JavaScript dan rantai janji dengan bantuan contoh.
Dalam JavaScript, promise adalah cara yang baik untuk menangani operasi asinkron . Ini digunakan untuk mengetahui apakah operasi asinkron berhasil diselesaikan atau tidak.
Sebuah janji bisa memiliki satu dari tiga kondisi.
- Menunggu keputusan
- Terpenuhi
- Ditolak
Sebuah janji dimulai dalam status menunggu keputusan. Artinya prosesnya belum selesai. Jika operasi berhasil, proses berakhir dengan status terpenuhi. Dan, jika terjadi kesalahan, proses berakhir dengan status ditolak.
Misalnya, saat Anda meminta data dari server dengan menggunakan promise, statusnya akan menunggu keputusan. Ketika data berhasil sampai, itu akan dalam keadaan terpenuhi. Jika terjadi kesalahan, maka itu akan dalam keadaan ditolak.
Buat Janji
Untuk membuat objek promise, kami menggunakan Promise()konstruktor.
let promise = new Promise(function(resolve, reject)( //do something ));
The Promise()konstruktor mengambil fungsi sebagai argumen. Fungsi tersebut juga menerima dua fungsi resolve()dan reject().
Jika janji berhasil dikembalikan, resolve()fungsi tersebut dipanggil. Dan, jika terjadi kesalahan, reject()fungsi tersebut dipanggil.
Misalkan program di bawah ini adalah program asynchronous. Kemudian program tersebut dapat ditangani dengan menggunakan sebuah promise.
Contoh 1: Program dengan Janji
const count = true; let countValue = new Promise(function (resolve, reject) ( if (count) ( resolve("There is a count value."); ) else ( reject("There is no count value"); ) )); console.log(countValue);
Keluaran
Janji (: "Ada nilai hitungan.")
Dalam program di atas, sebuah Promiseobjek dibuat yang mengambil dua fungsi: resolve()dan reject(). resolve()digunakan jika proses berhasil dan reject()digunakan saat terjadi kesalahan dalam janji.
Janji terselesaikan jika nilai hitungannya benar.
Bekerja dari janji JavaScript
Perangkaian Janji JavaScript
Janji berguna saat Anda harus menangani lebih dari satu tugas asinkron, satu per satu. Untuk itu, kami menggunakan rantai janji.
Anda bisa melakukan operasi setelah janji diselesaikan menggunakan metode then(), catch()dan finally().
JavaScript then ()
The then()metode yang digunakan dengan callback ketika janji itu berhasil dipenuhi atau diselesaikan.
Sintaks then()metode adalah:
promiseObject.then(onFulfilled, onRejected);
Contoh 2: Merangkai Janji dengan then ()
// returns a promise let countValue = new Promise(function (resolve, reject) ( resolve('Promise resolved'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); ), ) .then( function successValue1() ( console.log('You can call multiple functions this way.'); ), );
Keluaran
Janji terselesaikan Anda dapat memanggil beberapa fungsi dengan cara ini.
Dalam program di atas, then()metode ini digunakan untuk menghubungkan fungsi dengan promise. The then()Metode disebut ketika janji itu diselesaikan dengan sukses.
Anda bisa merangkai beberapa then()metode dengan promise.
JavaScript catch ()
The catch()metode yang digunakan dengan callback ketika janji itu ditolak atau jika terjadi kesalahan. Sebagai contoh,
// returns a promise let countValue = new Promise(function (resolve, reject) ( reject('Promise rejected'); )); // executes when promise is resolved successfully countValue.then( function successValue(result) ( console.log(result); ), ) // executes if there is an error .catch( function errorValue(result) ( console.log(result); ) );
Keluaran
Janji ditolak
Dalam program di atas, janji tersebut ditolak. Dan catch()metode tersebut digunakan dengan janji untuk menangani kesalahan.
Bekerja dari rantai janji JavaScript
Janji JavaScript versus Callback
Promises mirip dengan fungsi callback dalam arti keduanya dapat digunakan untuk menangani tugas asinkron.
Fungsi panggilan balik JavaScript juga dapat digunakan untuk melakukan tugas sinkron.
Perbedaan mereka dapat diringkas dalam poin-poin berikut:
Janji JavaScript
- Sintaksnya ramah pengguna dan mudah dibaca.
- Penanganan kesalahan lebih mudah untuk dikelola.
- Contoh:
api (). then (function (result) (return api2 ();)). then (function (result2) (return api3 ();)). then (function (result3) (// melakukan pekerjaan)). catch ( function (error) (// menangani error yang mungkin terjadi sebelum titik ini));
Panggilan Balik JavaScript
- Sintaksnya sulit dipahami.
- Penanganan kesalahan mungkin sulit untuk dikelola.
- Contoh:
api (function (result) (api2 (function (result2) (api3 (function (result3)) (// melakukan pekerjaan jika (error) (// melakukan sesuatu) else (// melakukan sesuatu)));));)) ;
JavaScript last () metode
You can also use the finally() method with promises. The finally() method gets executed when the promise is either resolved successfully or rejected. For example,
// returns a promise let countValue = new Promise(function (resolve, reject) ( // could be resolved or rejected resolve('Promise resolved'); )); // add other blocks of code countValue.finally( function greet() ( console.log('This code is executed.'); ) );
Output
This code is executed.
JavaScript Promise Methods
There are various methods available to the Promise object.
| Method | Description |
|---|---|
all(iterable) | Waits for all promises to be resolved or any one to be rejected |
allSettled(iterable) | Waits until all promises are either resolved or rejected |
any(iterable) | Returns the promise value as soon as any one of the promises is fulfilled |
race(iterable) | Wait until any of the promises is resolved or rejected |
reject(reason) | Returns a new Promise object that is rejected for the given reason |
resolve(value) | Returns a new Promise object that is resolved with the given value |
catch() | Appends the rejection handler callback |
then() | Appends the resolved handler callback |
finally() | Appends a handler to the promise |
To learn more about promises in detail, visit JavaScript Promises.
