Spread ve rest operatörleri
?? noktan?n ... iki g?revi vard?r. spread yinelenebilir bir de?eri ayr? konumlara yayar; rest kalan de?erleri toplar. Anlam? ifadedeki konumu belirler.
Spread ile de?erler
const extras = ["mint", "lemon"];
const menu = ["tea", ...extras];
console.log(menu.join(" / "));
Yazd?r?lan sat?r tam olarak tea / mint / lemon olur. extras tek bir ??e olmaz; ??eleri yeni diziye girer.
Dizileri kopyalamak
const extras = ["mint", "lemon"];
const copy = [...extras];
copy[0] = "ginger";
console.log(extras[0]);
console.log(copy[0]);
copy yeni bir d?? dizidir; onu de?i?tirmek extras? de?i?tirmez. Bu s?? kopyad?r: i? i?e object veya diziler ortak kal?r.
Object spread
const order = { guest: "lida", drink: "tea" };
const withSize = { ...order, size: "regular" };
console.log(order.size);
console.log(withSize.size);
order i?inde size yoktur, withSize i?inde vard?r. Object spread de s??d?r; i? i?e de?erler ba??ms?z kopyalanmaz.
Rest kalan? toplar
const menu = ["tea", "mint", "lemon"];
const [first, ...remaining] = menu;
const order = { guest: "lida", drink: "tea" };
const { guest, ...details } = order;
console.log(first, remaining, details);
first, tea olur; remaining, ["mint", "lemon"] olur; details i?inde drink vard?r ama guest yoktur. Bu yaln?zca ?nceki destructuring dersiyle k?sa bir kar??la?t?rmad?r.
Rest parametreleri
<!doctype html>
<html lang="en">
<head><meta charset="utf-8"><title>Spread and Rest</title></head>
<body>
<p id="result"></p>
<script>
const extras = ["mint", "lemon"];
const menu = ["tea", ...extras];
function list(first, ...others) {
return [first, ...others].join(" / ");
}
document.getElementById("result").textContent = list(...menu);
</script>
</body>
</html>
list(...menu) i?inde yayma ?a?r? yerinde olur. function list(first, ...others) i?inde rest ek arg?manlar? ger?ek bir dizide toplar. G?r?nen sonu? tea / mint / lemon olur.
Tablo farkı açıklar: noktalar aynıdır, ancak konumları JavaScript'in değerleri yaymasını mı kalanları toplamasını mı belirler.
📊 Ayn? noktalar, iki y?n
| Konum | Anlam | ?rnek |
|---|---|---|
| Dizi, object veya ?a?r? | Spread yayar | [..., extras], { ...order }, list(...menu) |
| Ba?lama veya parametre | Rest toplar | const [first, ...remaining] = menu, function list(first, ...others) |
K?sa al??t?rma
copy[0] de?erini de?i?tirin ve extras[0] ile kar??la?t?r?n. S?? kopyay? g?rmek i?in i? i?e bir object ekleyin.
Yayg?n hatalar
Rest parametresini ortaya koymay?n, derin kopya beklemeyin ve spread ile resti kar??t?rmay?n.
?zet
Spread dizi, object veya ?a?r?da g?r?n?r; rest ba?lama ya da parametrede g?r?n?r. Noktalar ayn?, g?revleri farkl?d?r.
🧠 Bilginizi Test Edin
Bilginizi Test Edin
Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör
📝 Talimatlar
- Her soruyu dikkatle okuyun
- Her soru için en iyi cevabı seçin
- Quiz'i istediğiniz kadar tekrar alabilirsiniz
- İlerlemeniz üstte gösterilecek