FluentStack

Promise Dasar

Mode tersedia: dark, light, paper
MasukDaftar
Intermediate · Level 5: JavaScript AdvancedIntermediate40 menitBahasa Indonesia

Promise Dasar

Memahami Promise sebagai hasil async yang sedang menunggu, berhasil, atau gagal.

StatusMemuat progres
ProgresMemuat...

...

Memuat progres

Menyiapkan langkah berikutnya

Tujuan belajar

  • Memahami kenapa operasi async tidak langsung memberi hasil final
  • Membedakan pending, fulfilled, dan rejected
  • Membaca alur Promise sederhana
JavaScriptPromiseAsync

Isi lesson

7 blok
  1. 1.
    Tidak semua hasil datang langsungBelum selesaiWajib
  2. 2.
    Promise punya tiga state pentingBelum selesaiWajib
  3. 3.
    Promise yang berhasilBelum selesaiWajib
  4. 4.
    Promise bukan hasil finalnyaBelum selesaiWajib
  5. 5.
    Cek pemahamanBelum selesaiWajib
  6. 6.
    Coding practiceBelum selesaiWajib
  7. 7.
    RingkasanBelum selesaiWajib

Tidak semua hasil datang langsung

Wajib

Di module sebelumnya, kamu sudah memakai fetch dasar. Saat JavaScript meminta data, hasilnya tidak selalu tersedia saat itu juga. Browser mungkin masih menunggu network, file, atau operasi lain.

Promise adalah object yang mewakili hasil async yang akan selesai nanti. Ia membantu kode menangani tiga kemungkinan: masih menunggu, berhasil, atau gagal.

Bagian ini memengaruhi progres lesson.

Promise punya tiga state penting

Wajib

pending berarti operasi masih berjalan. fulfilled berarti operasi berhasil dan punya value. rejected berarti operasi gagal dan punya alasan error.

Saat membaca kode async, jangan langsung bertanya output akhirnya apa. Tanyakan dulu: saat ini Promise masih pending, akan fulfilled, atau bisa rejected?

Bagian ini memengaruhi progres lesson.

Promise yang berhasil

Wajib
js
const lessonsPromise = Promise.resolve(["Scope", "Closure", "Async"]);

lessonsPromise.then((lessons) => {
  console.log("Jumlah lesson:", lessons.length);
});

Promise.resolve membuat Promise yang fulfilled dengan array lesson. then menjalankan callback saat Promise berhasil.

Bagian ini memengaruhi progres lesson.

Kesalahan umum

Wajib

Promise bukan hasil finalnya

Variable yang berisi Promise bukan langsung data final. Kalau kamu console.log promise-nya, kamu melihat object Promise, bukan array atau data yang ingin dipakai. Data final dibaca setelah Promise fulfilled.

Bagian ini memengaruhi progres lesson.

Cek pemahaman

WajibJawab dulu

Cek pemahaman singkat

Promise yang masih menunggu hasil request berada pada state apa?

Progres lesson naik setelah jawaban benar.

Coding practice

WajibDibuka di workspace khusus

Prediksi Promise states

Latihan mengenali pending, fulfilled, dan rejected dalam flow Promise sederhana.

Tujuan awal: Fokus di tab JS.

Practice ini dibuka di workspace khusus. Buka practice untuk memakai editor, preview, dan cek otomatis.

Tombol selesai aktif setelah semua validasi wajib lolos.

3 cek otomatis3 checklist
Belum selesaiBuka practice

Ringkasan

Wajib
  • Promise mewakili hasil operasi async yang selesai nanti.
  • pending berarti masih menunggu.
  • fulfilled berarti operasi berhasil.
  • rejected berarti operasi gagal.
  • Berikutnya, kamu akan menulis async flow yang lebih mudah dibaca dengan async/await.

Bagian ini memengaruhi progres lesson.

Langkah berikutnya

Selesaikan bagian penting lesson ini

Lanjutkan blok wajib berikutnya: Tidak semua hasil datang langsung.