CodeBlanks Logo Icon CodeBlanks

Spread operatörü (diziler)

JavaScript kursu · İleri seviye · Ders 30/100

... ile bir dizinin elemanlarını tek tek yaymayı öğrenirsin.

Spread operatörü

Spread operatörü üç noktayla yazılır: .... Bir dizinin önüne koyduğunda elemanlarını tek tek açar. const copy = [...fruits] yazdığında fruits'ün her elemanı yeni bir diziye kopyalanır; orijinal dizi değişmez.

Bu, fruits.slice() yazmakla aynıdır; ama daha kısa ve okunaklıdır. Spread, diziyi yeni bir dizi içine açtığı için birleştirme ve kopyalamada çok kullanılır.

Dizileri birleştirme

Spread'in en yaygın kullanımı dizileri birleştirmektir. İki dizinin önüne ... koyup yeni bir dizi içine yazarsan, elemanlar düz bir liste halinde yan yana gelir.

Örneğin const menu = [...morning, ...afternoon] yazdığında menu, iki dizinin tüm elemanlarını tek bir dizi olarak tutar. Bu, morning.concat(afternoon) yazmaktan daha okunaklıdır.

Uygulama Görev listesini birleştir

weekend ve weekdays adında iki dizi oluştur. Her ikisini de en az iki görev string'i ile doldur. Sonra allTasks adında yeni bir dizi oluştur ve spread ile iki diziyi birleştir. allTasks'ı console.log ile yazdır.

Örnek çözümü göster
const weekend = ["dinlenme", "yürüyüş"];
const weekdays = ["kodlama", "toplantı", "test"];
const allTasks = [...weekend, ...weekdays];
console.log(allTasks);

Kendini test et

  1. `const copy = [...fruits]` ne yapar?

    const fruits = ["elma", "armut"];
    const copy = [...fruits];
    • `fruits` dizisini boşaltır
    • `fruits`'ün elemanlarını yeni bir diziye kopyalar
    • `fruits`'ün eleman sayısını döndürür
    • `fruits` dizisini alfabetik sıralar
    Cevabı göster

    `fruits`'ün elemanlarını yeni bir diziye kopyalar — Doğru. Spread, elemanları yeni bir diziye açar; orijinal değişmez.

  2. İki diziyi birleştir

    const morning = ["çay", "kahve"];
    const afternoon = ["çorba", "salata"];
    const menu = [____];
    console.log(menu);
    Cevabı göster
    const morning = ["çay", "kahve"];
    const afternoon = ["çorba", "salata"];
    const menu = [...morning, ...afternoon];
    console.log(menu);
  3. `[...a, ...b]` ne üretir?

    const a = [1, 2];
    const b = [3, 4];
    const c = [...a, ...b];
    • `a` ve `b`'nin tüm elemanlarını içeren tek bir dizi
    • `a` ve `b`'yi iç içe yerleştiren iki boyutlu dizi
    • Yalnızca `a`'nın elemanlarını içeren dizi
    • Yalnızca `b`'nin elemanlarını içeren dizi
    Cevabı göster

    `a` ve `b`'nin tüm elemanlarını içeren tek bir dizi — Doğru. Spread her iki diziyi de açar; sonuç düz bir dizidir.

İleri seviye bölümündeki tüm dersler