0Pricing
JavaScript Academy · Ders

Yapısal Klonlama ve URLSearchParams

structuredClone ile verileri derin kopyalayın (Dates/Maps/Sets korunur) ve URLSearchParams ile sorgu dizelerini ayrıştırıp oluşturun.

Yapısal Klonlama ve URLSearchParams, CoddyKit'te ücretsiz bir JavaScript Academy dersidir. Bu, 3 dersinin 2. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, JavaScript Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. JavaScript Academy kursu toplamda 3 dersten oluşur.

Bu araçlar neden?

Amaç: URL verilerini güvenli biçimde kopyalamak ve serileştirmek.

  • structuredClone verilerin derin kopyasını oluşturur
  • Tarih/Eşleme/Küme türlerini korur
  • URL sorgu parametreleri sorguları ayrıştırır ve oluşturur
  • Yeni başlayanlara uygun kalıplar
Yapısal Klonlama ve URLSearchParams — resim 1

Türleri koruyan derin kopya

structuredClone derin bir kopya oluşturur ve Tarih nesnelerini olduğu gibi korur.

// 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);
Yapısal Klonlama ve URLSearchParams — resim 2

JSON türleri kaybeder

JSON yalnızca verilerden oluşur; Tarih/Eşleme/Küme düz değerlere dönüşür veya kaybolur.

// 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);
Yapısal Klonlama ve URLSearchParams — resim 3

Eşlemeler ve kümeler korunur

Eşleme ve küme, structuredClone ile doğru biçimde kopyalandığında varlığını korur.

// 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));
Yapısal Klonlama ve URLSearchParams — resim 4

Sorgu dizelerini ayrıştırma

URL sorgu parametreleri sorgu dizelerini okur; gerekirse get, getAll, has kullanın ve yineleyin.

// 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"));
Yapısal Klonlama ve URLSearchParams — resim 5

Sorgu dizeleri oluşturma

Güvenli sorgu dizeleri oluşturmak için set/append ve ardından toString() kullanın.

// 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);
Yapısal Klonlama ve URLSearchParams — resim 6

structuredClone ve JSON testi

Hızlı kontrol: Türleri koruyan derin kopya.

Yapısal Klonlama ve URLSearchParams — resim 7

Özet

Özet: Tarih/Eşleme/Küme gibi türleri koruyan derin kopyalar için structuredClone kullanın. Sorgu dizelerini güvenli biçimde ayrıştırmak ve oluşturmak için URL sorgu parametrelerini kullanın.

Yapısal Klonlama ve URLSearchParams — resim 8

Sıkça Sorulan Sorular

“Yapısal Klonlama ve URLSearchParams” dersi ücretsiz mi?

Evet — “Yapısal Klonlama ve URLSearchParams” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve JavaScript Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. JavaScript Academy kursu toplamda 3 dersten oluşur.

“Yapısal Klonlama ve URLSearchParams” dersinde ne öğreneceğim?

structuredClone ile verileri derin kopyalayın (Dates/Maps/Sets korunur) ve URLSearchParams ile sorgu dizelerini ayrıştırıp oluşturun. JavaScript Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.

JavaScript Academy öğrenmeye başlamak için deneyim gerekli mi?

Önceden deneyim gerekmez. CoddyKit'te JavaScript Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 3 dersinin 2. dersidir.

“Yapısal Klonlama ve URLSearchParams” dersi ne kadar sürer?

Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.

Bu JavaScript Academy dersinde kod yazıp çalıştırabilir miyim?

Evet. Her JavaScript Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.

Bu kursun tüm dersleri

  1. JSON.parse / JSON.stringify temelleri
  2. Yapısal Klonlama ve URLSearchParams
  3. Güvenli JSON Ayrıştırma Stratejileri
← JavaScript Academy Sayfasına Dön