← JavaScript43 / 69

fetch: mengambil data dari API

fetch mengembalikan Promise berisi object Response — perhatikan bahwa datanya belum siap, perlu await res.json() sebagai langkah kedua. Jebakan penting: fetch tidak melempar error untuk status 404 atau 500; ia hanya gagal saat jaringan bermasalah. Karena itu kamu harus memeriksa res.ok sendiri.

👀 Contoh dulu

async function ambilUser() {
  const res = await fetch('https://jsonplaceholder.typicode.com/users/1');

  console.log(res.status);   // 200
  console.log(res.ok);       // true kalau status 200-299

  if (!res.ok) return;       // WAJIB diperiksa sendiri

  const data = await res.json();   // langkah kedua
  console.log(data.name);
}

ambilUser();

Hasilnya: 200 true Leanne Graham

💡 Dua langkah: fetch dapat Response, lalu res.json() dapat datanya. Status 404 TIDAK otomatis error.

📝 Sekarang giliranmu

Buat fungsi async yang fetch https://jsonplaceholder.typicode.com/todos/1, periksa res.ok, ambil await res.json(), dan tampilkan hasilnya.

Preview

← Sebelumnya Berikutnya →