JavaScript Rest (...) Operatörü ve Destructuring
Rest (...) Operatörü
Rest Operatörü: fonksiyonun aldığı parametrelerin tek bir argüman halinde toplu olarak gönderilmesini sağlar. Sonucu bir dizi olarak döndürür. Parametre sayısı bilinmeyen fonksiyonlar için oldukça kullanışlıdır.
function ornek(...veriler) {
console.log(veriler) // ['Yağmur', 'Cengiz', 'Deniz', 'Burcu']
}
ornek("Yağmur","Cengiz","Deniz","Burcu")
Örnek olarak: değeri 100'den büyük olan argümanların kaç tane olduğunu dönen fonksiyonu yazalım.
function topla(...sayilar) {
let sonuc = 0
for (let i = 0; i < sayilar.length; i++) {
if (sayilar[i] > 100) {
sonuc++
}
}
return sonuc
}
console.log(topla(120,50,470,95,210)) // 3
Rest operatörü ile birlikte diğer parametler de kullanılacak ise: rest operatörü son parametre olarak yazılmalıdır.
Örnek olarak: bir kafedeki müşterinin hangi masada oturduğunu ve verdiği siparişlerin tutarını hesaplayan bir fonksiyonu yazalım.
var fiyatListesi = {ayran: 15, cay : 10, limonata : 20, kahve : 30, su : 10, tost : 40 }
function adisyon(masaNumarasi,...siparisler) {
let hesap = 0
for (let i = 0; i < siparisler.length; i++) {
hesap += fiyatListesi[siparisler[i]]
}
return "Masa Numarası: " + masaNumarasi + " / Hesap: " + hesap + " TL"
}
console.log(adisyon("7","ayran","tost","su")) // Masa Numarası: 7 / Hesap: 65 TL
Destructuring
Rest operatörü: dizileri ve nesneleri yapılandırmak için kullanılabilir. İstenilen elemanlar değişkenlere atandıktan sonra, Rest operatörü ile kalan tüm elemanlarda bir değişkende toplanabilir.
let ornekDizi = [1,2,3,4,5,6,7,8,9]
let [ilkEleman, ikinciEleman, ...kalanElamanlar] = ornekDizi
console.log(ikinciEleman) // 1
console.log(ikinciEleman) // 2
console.log(kalanElamanlar) // [3, 4, 5, 6, 7, 8, 9]
let kisi = {ad: "Olcay", soyad: "Kurt", il: "Burdur", ilce: "Bucak", yas: "27", cinsiyet: "Erkek"}
let {ad, soyad, ...kalanlar} = kisi
console.log(ad) // Olcay
console.log(soyad) // Kurt
console.log(kalanlar) // {il: 'Burdur', ilce: 'Bucak', yas: '27', cinsiyet: 'Erkek'}