Kloning Terstruktur dan URLSearchParams
Salin data secara mendalam dengan structuredClone (mempertahankan Date/Map/Set), lalu uraikan dan buat string kueri dengan URLSearchParams
Kloning Terstruktur dan URLSearchParams adalah pelajaran JavaScript Academy gratis di CoddyKit. Ini adalah pelajaran 2 dari 3. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar JavaScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus JavaScript Academy mencakup 3 pelajaran total.
Mengapa menggunakan alat-alat ini?
Tujuan: Menyalin dan membuat serialisasi data URL dengan aman.
- structuredClone menyalin data secara mendalam
- Mempertahankan Date/Map/Set
- URLSearchParams mengurai dan membuat kueri
- Pola yang ramah bagi pemula

Salinan mendalam yang mempertahankan tipe
structuredClone membuat salinan mendalam dan mempertahankan objek Date apa adanya.
// Deep copy with structuredClone (Node 17+/modern browsers)
const original = { n: 1, list: [1, 2], when: new Date("2024-01-01") };
const copy = structuredClone(original);
copy.n = 2;
copy.list.push(3);
console.log("original.n:", original.n);
console.log("copy.n:", copy.n);
console.log("dates equal type?", copy.when instanceof Date);

JSON menghilangkan tipe
JSON hanya berisi data; Date/Map/Set berubah menjadi nilai biasa atau hilang.
// JSON round-trip loses special types (e.g., Date becomes string)
const obj = { when: new Date("2024-01-01"), ok: true };
const round = JSON.parse(JSON.stringify(obj));
console.log("after JSON:", typeof round.when, round.when);
console.log("is Date?", round.when instanceof Date);

Map dan Set tetap utuh
Map dan Set tetap utuh setelah dikloning dengan structuredClone.
// structuredClone preserves Map and Set
const m1 = new Map([["a", 1]]);
const s1 = new Set([1, 2]);
const cloned = structuredClone({ m1, s1 });
console.log("map has a?", cloned.m1.has("a"));
console.log("set has 2?", cloned.s1.has(2));

Mengurai string kueri
URLSearchParams membaca string kueri; gunakan get, getAll, has, dan lakukan iterasi jika diperlukan.
// Parse a query string with URLSearchParams
const qs = "q=shoes&color=red&color=blue&page=2";
const params = new URLSearchParams(qs);
console.log("q:", params.get("q"));
console.log("first color:", params.get("color"));
console.log("all colors:", params.getAll("color"));
console.log("page:", params.get("page"));

Membuat string kueri
Gunakan set/append, lalu toString() untuk membuat string kueri yang aman.
// Build a query string from key/value pairs
const build = new URLSearchParams();
build.set("q", "shoes");
build.append("color", "red");
build.append("color", "blue");
build.set("page", String(2));
console.log("query:", build.toString());
// Example full URL
const url = "https://example.com/search?" + build.toString();
console.log("url:", url);

Kuis structuredClone dan JSON
Pemeriksaan singkat: Salinan mendalam yang mempertahankan tipe.

Ringkasan
Ringkasan: Gunakan structuredClone untuk salinan mendalam yang mempertahankan tipe seperti Date/Map/Set. Gunakan URLSearchParams untuk mengurai dan membuat string kueri dengan aman.

Pertanyaan yang Sering Diajukan
Apakah pelajaran “Kloning Terstruktur dan URLSearchParams” gratis?
Ya — teks lengkap “Kloning Terstruktur dan URLSearchParams” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus JavaScript Academy, upgrade ke CoddyKit PRO. Kursus JavaScript Academy mencakup 3 pelajaran total.
Apa yang akan aku pelajari di “Kloning Terstruktur dan URLSearchParams”?
Salin data secara mendalam dengan structuredClone (mempertahankan Date/Map/Set), lalu uraikan dan buat string kueri dengan URLSearchParams Kamu berlatih JavaScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai JavaScript Academy?
Tidak diperlukan pengalaman sebelumnya. JavaScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 2 dari 3.
Berapa lama pelajaran “Kloning Terstruktur dan URLSearchParams” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran JavaScript Academy ini?
Ya. Setiap pelajaran JavaScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Dasar-Dasar JSON.parse / JSON.stringify
- Kloning Terstruktur dan URLSearchParams
- Strategi Penguraian JSON yang Aman