- Konu sahibi
- #1
JavaScript’te concat, metinleri veya dizileri birleştirip yeni bir sonuç oluşturan yöntemdir. Kullanım yerine göre
Bir metnin ardından bir veya daha fazla metin eklemek için kullanılır:
Burada
Metin birleştirmede daha yaygın alternatifler de vardır:
Kısa iki metin için
Dizilerde
Birden fazla dizi veya tekil değer aynı çağrıda verilebilir:
Dizi içeren bir argüman bir seviye açılır; iç içe diziler derinlemesine düzleştirilmez:
Bu nedenle tüm iç içe yapıyı düzleştirmek istiyorsanız
Aşağıdaki ayrım, yanlış yöntem seçimini önler.
Mevcut diziyi koruyarak yeni bir liste oluşturmanız gerekiyorsa sonucu ayrı değişkene atayın:
Sonucu değişkene atamamak:
Metin ve dizi concat yöntemlerini karıştırmak:
İç içe dizilerin tamamen açılacağını sanmak:
Sıralamayı gözden kaçırmak: Elemanlar ve diziler, çağrıdaki sırayla sonucun arkasına eklenir.
Çalıştırma kontrolü için yukarıdaki örneklerden birini tarayıcı geliştirici konsoluna veya Node.js ortamına yerleştirin. Beklenen dizi ya da metin görünüyorsa kullanım doğrudur. Kaynak değer değişmiş görünmüyorsa bu genellikle hata değil,
Hayır.
Hayır. Yeni dizi oluşturur ancak içindeki nesne ve iç içe dizi gibi referans türleri aynı referansları koruyabilir. Bu nedenle nesne içeriğinin bağımsız kopyalanması gerekiyorsa ayrıca uygun bir kopyalama yöntemi seçilmelidir.
String.prototype.concat() metinleri, Array.prototype.concat() ise dizileri birleştirir. concat() kaynak metni veya diziyi doğrudan değiştirmez; birleştirilmiş yeni değer döndürür.String concat nasıl çalışır?
Bir metnin ardından bir veya daha fazla metin eklemek için kullanılır:
JavaScript:
const ad = "Ali";
const soyad = "Yılmaz";
const tamAd = ad.concat(" ", soyad);
console.log(tamAd); // Ali Yılmaz
console.log(ad); // AliBurada
ad değişkeni değişmez. concat() sonucu tamAd değişkenine atanır. Sayı ve boolean gibi metne dönüştürülebilen argümanlar birleştirilir; dönüştürülemeyen bir değer hata üretebilir. Okunabilirlik için bu tür dönüşümleri açıkça yapmak çoğu zaman daha güvenlidir.Metin birleştirmede daha yaygın alternatifler de vardır:
JavaScript:
const kullanici = "Ayşe";
const mesaj = `Merhaba, ${kullanici}!`;
console.log(mesaj); // Merhaba, Ayşe!Kısa iki metin için
+, değişken ve ifadelerin birlikte kullanıldığı metinler için şablon dizileri tercih edilebilir. concat() özellikle birden fazla metni yöntem zinciriyle birleştirmek istediğinizde kullanılabilir.Array concat ile dizileri birleştirme
Dizilerde
concat(), bir dizinin elemanlarını diğer dizilerin veya tekil değerlerin arkasına ekleyerek yeni bir dizi üretir:
JavaScript:
const temelRoller = ["okuma", "yazma"];
const yoneticiRolleri = ["silme", "kullanıcı yönetimi"];
const tumRoller = temelRoller.concat(yoneticiRolleri);
console.log(tumRoller);
// ["okuma", "yazma", "silme", "kullanıcı yönetimi"]
console.log(temelRoller);
// ["okuma", "yazma"]Birden fazla dizi veya tekil değer aynı çağrıda verilebilir:
JavaScript:
const sayilar = [1, 2].concat([3, 4], 5, [6]);
console.log(sayilar); // [1, 2, 3, 4, 5, 6]Dizi içeren bir argüman bir seviye açılır; iç içe diziler derinlemesine düzleştirilmez:
JavaScript:
const sonuc = [1].concat([2, [3, 4]]);
console.log(sonuc); // [1, 2, [3, 4]]Bu nedenle tüm iç içe yapıyı düzleştirmek istiyorsanız
flat() gibi ayrı bir işlem gerekir.Hangi durumda hangisi kullanılmalı?
Aşağıdaki ayrım, yanlış yöntem seçimini önler.
| İhtiyaç | Uygun kullanım | Sonuç |
|---|---|---|
| Metinleri birleştirmek | metin.concat(digerMetin) | Yeni metin |
| Değişkenli mesaj oluşturmak | Şablon dizisi | Yeni metin |
| Dizileri birleştirmek | dizi.concat(digerDizi) | Yeni dizi |
| Mevcut diziyi yerinde değiştirmek | push(...digerDizi) | Kaynak dizi değişir |
JavaScript:
const oncekiListe = ["A", "B"];
const yeniListe = oncekiListe.concat("C");
console.log(yeniListe); // ["A", "B", "C"]
console.log(oncekiListe); // ["A", "B"]Uygularken kontrol sırası
- Birleştirdiğiniz değerlerin metin mi dizi mi olduğunu belirleyin; aynı yöntem adının farklı alıcılarda farklı sonuç verdiğini unutmayın.
- Sonucun kullanılacağı değişkeni veya dönüş değerini açıkça tanımlayın. Kaynak üzerinde değişiklik bekliyorsanız concat bu amacı yerine getirmez.
- Nesne içeren listelerde yalnız üst dizinin kopyalandığını dikkate alın; ortak nesneyi değiştirmek iki listede de görülebilir.
- Boş dizi, birden fazla argüman ve iç içe dizi örnekleriyle beklediğiniz sonucu karşılaştırın. Sıralama ve tekilleştirme gerekiyorsa bunları ayrıca uygulayın.
Sık yapılan hatalar
Sonucu değişkene atamamak:
liste.concat(yeniListe) çağrısı kaynak listeyi değiştirmez. Sonucu kullanmak için const birlesik = liste.concat(yeniListe) şeklinde atama yapın.Metin ve dizi concat yöntemlerini karıştırmak:
"a".concat("b") metin döndürür; ["a"].concat(["b"]) dizi döndürür.İç içe dizilerin tamamen açılacağını sanmak:
concat() yalnızca doğrudan verilen dizi argümanını bir seviyede birleştirir.Sıralamayı gözden kaçırmak: Elemanlar ve diziler, çağrıdaki sırayla sonucun arkasına eklenir.
Çalıştırma kontrolü için yukarıdaki örneklerden birini tarayıcı geliştirici konsoluna veya Node.js ortamına yerleştirin. Beklenen dizi ya da metin görünüyorsa kullanım doğrudur. Kaynak değer değişmiş görünmüyorsa bu genellikle hata değil,
concat() yönteminin yeni sonuç üretme davranışıdır.Sık sorulan sorular
concat() tekrar eden elemanları kaldırır mı?
Hayır.
[1, 2].concat([2, 3]) sonucu [1, 2, 2, 3] olur. Tekilleştirme ayrı bir karardır; nesnelerde eşitliğin hangi alana göre belirleneceği de ayrıca tasarlanmalıdır.concat() derin kopya oluşturur mu?
Hayır. Yeni dizi oluşturur ancak içindeki nesne ve iç içe dizi gibi referans türleri aynı referansları koruyabilir. Bu nedenle nesne içeriğinin bağımsız kopyalanması gerekiyorsa ayrıca uygun bir kopyalama yöntemi seçilmelidir.
