JavaScript’te “String Concatenation” Kullanımı

JavaScript’te “string concatenation” işlemi için kısaca; “metinsel ifadeleri, yani karakter dizilerini (string)” birleştirme işlemidir diyebiliriz.

Bu işlem, sadece JavaScript’te değil diğer pek çok programlama dilinde de görülmekte olup temel mantık iki veya daha fazla karakter dizisini birleştirerek yeni bir karakter dizisi oluşturmak üzerinedir. Gelin, nasıl yapıldığını inceleyelim:

JavaScript’te string concatenation işlemi “+” işaretiyle yapılır. Örneğin, aşağıdaki kodda “Hello ” ve “World!” karakter dizileri “+” operatörü birleştirilerek “HelloWorld!” karakter dizisi oluşturulmuştur. Bakınız:

// JavaScript Concatenation
let str1 = "Hello";
let str2 = "world!";
let result = str1 + str2;

console.log(result); // "HelloWorld!"

❗ Yukarıdaki örnekte çıktı “HelloWorld!” şeklindedir. Eğer iki karakter dizisi arasında boşluk olsun istiyorsak örneği aşağıdaki gibi yazabiliriz:

// JavaScript Concatenation - Yöntem 1
let str1 = "Hello ";
let str2 = "World!";
let result1 = str1 + str2;

console.log(result); // "Hello World!"

// JavaScript Concatenation - Yöntem 2
let str3 = "Hello";
let str4 = " World!";
let result2 = str3 + str4;

console.log(result2); // "Hello World!"

// JavaScript Concatenation - Yöntem 3
let str5 = "Hello";
let str6 = "World!";
let result3 = str5 + " " + str6;

console.log(result3); // "Hello World!"

“String concatenation” işlemini pekala “concat()” metodunu kullanarak da gerçekleştirebiliriz. Bunun için aşağıdaki örneği inceleyiniz:

// JavaScript Concatenation - Yöntem 1
let str1 = "Hello ";
let str2 = "World!";
let result1 = str1.concat(str2);

console.log(result); // "Hello World!"

// JavaScript Concatenation - Yöntem 2
let str3 = "Hello";
let str4 = " World!";
let result2 = str3.concat(str4);

console.log(result2); // "Hello World!"

// JavaScript Concatenation - Yöntem 3
let str5 = "Hello";
let str6 = "World!";
let result3 = str5.concat(" ", str6);

console.log(result3); // "Hello World!"

Genel kullanımda, daha kısa ve daha okunaklı bir yazım sunduğu için “+” işareti ile yapılan “string concatenation” işlemi daha yaygın kullanılan bir yöntemdir.

❗ Ancak “+” operatörü, sayısal bir veri tipi veya başka bir tip veri ile bir string ifadesini birleştirirken type coercion‘a neden olabilir. Bundan ötürü dizileri (array) birleştirmek için de kullanılan “concat()” metodu bu tür durumlarda daha güvenli alternatif bir yol olmaktadır. Söz dizimi (syntax) ise aşağıdaki gibidir:

string.concat(string2, string3, …, stringN)

Aşağıdaki örnekte bu durum net bir şekilde gösterilmiştir:

let metin1 = "Merhaba, ";
let metin2 = "Dünya!";
let sonuc = metin1.concat(metin2);
console.log(sonuc); // "Merhaba, Dünya!"

Yukarıdaki örnekte, iki metin değişkenini (metin1 ve metin2) birleştiriyoruz. Bu değişkenlerin değerleri “Merhaba, ” ve “Dünya!” şeklinde. concat() metodu kullanılarak bu iki dize birleştirilir ve “Merhaba, Dünya!” sonucunu alırız.

let num1 = 5;
let num2 = 3;
let str1 = "5";

let result1= num1 + num2 + str1; 
let result2= str1.concat(num1, num2); 

console.log(result1); // "85"
console.log(result2); // "553"

İkinci örnekte ise, concat() metodunun bahsettiğimiz özelliğini gözlemliyoruz. Burada, sayıları (number) ve dizeleri (string) birleştirmeye çalışıyoruz. JavaScript’te, + operatörü kullanıldığında sayı ve dize arasındaki toplama, sayının dizeye dönüştürülüp (type coercion) bu iki dizenin birleştirilmesi şeklinde gerçekleşir. Bu nedenle, result1 için sonuç “85” olarak çıktı vermiştir.

Ancak, concat() metodu sayıları otomatik olarak dizeye dönüştürmediği için str1.concat(num1, num2) ifadesinde, num1 ve num2 değerleri dize olarak değil, sayı olarak alınır ve doğrudan str1 dizesine eklenir. Sonuç olarak, “553” değerini elde ederiz.