[NODE JS] Spread ve Rest Operatörleri
Merhaba arkadaşlar. Bugün üç nokta operatörünü (...) konuşacağız. Bu üç nokta iki farklı amaçla kullanılıyor: spread ve rest. İkisi de aynı sözdizimini kullanır ama yaptıkları iş tam tersi. Spread dağıtır, rest toplar. Bu farkı anlamak önemli çünkü ben başta ikisini karıştırıyordum ve yazdığım kodun neden çalışmadığını anlamakta zorlanıyordum.
Spread Operatörü
Spread operatörü bir iterable'ı (array, string, obje) elemanlarına ayırır. Array kopyalama, birleştirme, obje klonlama ve fonksiyon çağrılarında argüman geçirme gibi birçok yerde kullanılır. Ben özellikle immutable veri yapıları oluştururken çok kullanıyorum, React ile çalışanlar zaten spread'siz yapamaz.
Production'da en çok karşılaştığım senaryo: bir objenin bazı property'lerini değiştirip yeni bir obje oluşturmak. Orijinal objeyi değiştirmeden yeni bir kopya oluşturmak state management'ta altın kural. Spread operatörü bunu tek satırda yapmanızı sağlıyor.
JavaScript:
// === SPREAD OPERATÖRÜ ===
// 1. Array Spread
const meyveler = ['elma', 'armut', 'muz'];
const sebzeler = ['domates', 'biber', 'salatalık'];
// Array birleştirme (eski yöntem: concat)
const hepsi = [...meyveler, ...sebzeler];
console.log(hepsi); // ['elma', 'armut', 'muz', 'domates', 'biber', 'salatalık']
// Array kopyalama (shallow copy)
const kopyaMeyveler = [...meyveler];
kopyaMeyveler.push('çilek');
console.log('Orijinal:', meyveler); // değişmedi
console.log('Kopya:', kopyaMeyveler); // ['elma', 'armut', 'muz', 'çilek']
// Array'in arasına eleman ekleme
const yeniListe = ['portakal', ...meyveler, 'karpuz'];
console.log(yeniListe);
// String'i karakterlere ayırma
const kelime = 'Merhaba';
const harfler = [...kelime];
console.log(harfler); // ['M', 'e', 'r', 'h', 'a', 'b', 'a']
// Math.max ile spread
const sayilar = [45, 12, 78, 3, 92, 56];
console.log('En büyük:', Math.max(...sayilar)); // 92
console.log('En küçük:', Math.min(...sayilar)); // 3
// Set ile benzersiz elemanlar
const tekrarli = [1, 2, 2, 3, 3, 3, 4, 4, 4, 4];
const benzersiz = [...new Set(tekrarli)];
console.log('Benzersiz:', benzersiz); // [1, 2, 3, 4]
// 2. Object Spread
const varsayilan = {
tema: 'açık',
dil: 'tr',
bildirimler: true,
yazıBoyutu: 14,
otomatikKayit: true
};
const kullaniciAyar = {
tema: 'koyu',
yazıBoyutu: 16
};
// Obje birleştirme (sonraki aynı key'i ezer)
const sonAyarlar = { ...varsayilan, ...kullaniciAyar };
console.log(sonAyarlar);
// { tema: 'koyu', dil: 'tr', bildirimler: true, yazıBoyutu: 16, otomatikKayit: true }
// Tek property güncelleme
const guncelKullanici = {
isim: 'Ahmet',
yas: 28,
sehir: 'İstanbul'
};
const yasGuncel = { ...guncelKullanici, yas: 29 };
console.log(yasGuncel); // yas: 29, geri kalanı aynı
// Koşullu spread
const debug = true;
const config = {
port: 3000,
host: 'localhost',
...(debug && { logSeviyesi: 'verbose', detayliHata: true })
};
console.log(config);Rest Operatörü
Rest operatörü spread'in tersi: dağınık elemanları bir araya toplar. Fonksiyon parametrelerinde ve destructuring işlemlerinde kullanılır. Fonksiyonlarda argüman sayısı belirsiz olduğunda rest parametresi kullanmak en temiz çözüm.
Geçen bir projede dinamik olarak parametre alan bir loglama fonksiyonu yazmam gerekiyordu. Rest parametresi olmasa bunu arguments objesi ile yapmam gerekirdi ki bu hem daha karmaşık hem de arrow function'larda çalışmaz.
JavaScript:
// === REST OPERATÖRÜ ===
// 1. Fonksiyon parametrelerinde rest
function topla(...sayilar) {
return sayilar.reduce((toplam, sayi) => toplam + sayi, 0);
}
console.log(topla(1, 2, 3)); // 6
console.log(topla(10, 20, 30, 40)); // 100
// İlk parametre ayrı, kalanlar rest
function logla(seviye, ...mesajlar) {
const zaman = new Date().toLocaleTimeString('tr-TR');
const birlesik = mesajlar.join(' ');
console.log(`[${zaman}] [${seviye.toUpperCase()}] ${birlesik}`);
}
logla('info', 'Sunucu', 'başlatıldı', 'port:', '3000');
logla('error', 'Veritabanı', 'bağlantısı', 'başarısız');
logla('warn', 'Bellek', 'kullanımı', 'yüksek');
// 2. Array destructuring'de rest
const [ilk, ikinci, ...kalanSayilar] = [1, 2, 3, 4, 5, 6, 7];
console.log(ilk); // 1
console.log(ikinci); // 2
console.log(kalanSayilar); // [3, 4, 5, 6, 7]
// 3. Object destructuring'de rest
const tam = {
id: 1,
isim: 'Ahmet',
email: 'ahmet@test.com',
sifre: 'gizli123',
olusturma: '2024-01-15',
guncelleme: '2024-06-20'
};
// Hassas bilgileri ayırma
const { sifre, ...guvenliVeri } = tam;
console.log(guvenliVeri); // sifre olmadan tüm veri
// API response temizleme
function temizle(obje, ...cikarilacaklar) {
const sonuc = { ...obje };
cikarilacaklar.forEach(key => delete sonuc[key]);
return sonuc;
}
const temiz = temizle(tam, 'sifre', 'olusturma', 'guncelleme');
console.log(temiz); // { id: 1, isim: 'Ahmet', email: 'ahmet@test.com' }
// Gerçek dünya: middleware fonksiyonu
function middleware(...fonksiyonlar) {
return function(istek) {
let sonuc = istek;
for (const fn of fonksiyonlar) {
sonuc = fn(sonuc);
if (sonuc.hata) break;
}
return sonuc;
};
}
const dogrula = (req) => ({ ...req, dogrulandi: true });
const logMiddle = (req) => { console.log('İstek:', req.url); return req; };
const yetkilendir = (req) => ({ ...req, yetkili: req.dogrulandi });
const pipeline = middleware(dogrula, logMiddle, yetkilendir);
const sonuc = pipeline({ url: '/api/test', method: 'GET' });
console.log(sonuc);Spread ve rest operatörleri modern JavaScript'in olmazsa olmazları. Bir kez alıştığınızda onsuz kod yazamaz hale gelirsiniz. Özellikle immutability, fonksiyonel programlama ve temiz API tasarımı için vazgeçilmez araçlar. Kolay gelsin arkadaşlar.
