Materi
fetch(url) meminta sumber daya lewat jaringan dan langsung mengembalikan Promise, yang fulfilled dengan objek Response begitu jawaban tersedia. Badan jawaban dibaca terpisah, misalnya dengan response.json(). Method itu juga mengembalikan Promise, berisi hasil penguraian badan sebagai JSON, yaitu array atau objek JavaScript. Jadi ada dua await: satu untuk Response, satu untuk badannya.
async function muatKota(ambil) {
const res = await ambil("/api/kota"); // Response
const kota = await res.json(); // array hasil penguraian
return kota.map((k) => k.nama);
}
// di halaman sungguhan: await muatKota(fetch)Latihan di sini tidak memakai jaringan sungguhan, supaya hasilnya sama setiap kali dijalankan dan tidak bergantung pada server mana pun. Sebagai gantinya, kode awal memuat pengambil tiruan buatAmbil. Ia dipanggil seperti fetch(url) dan mengembalikan Promise berisi objek mirip Response dengan ok, status, dan json(). Fungsimu menerima pengambil itu sebagai argumen, jadi kode yang sama berjalan dengan fetch sungguhan.
Setelah data tiba, setiap item menjadi satu li yang teksnya diisi lewat textContent, lalu ditempel ke daftar. Mengisi textContent induk dengan teks kosong lebih dulu membuang semua anaknya, termasuk tulisan Memuat…, sehingga pemuatan ulang tidak menggandakan isi. textContent memasang teks apa adanya, jadi nama dari server yang memuat tanda < tidak pernah ditafsirkan sebagai HTML.
