JavaScript Dilinde RegExp (Düzenli İfadeler) Kullanımı

JavaScript'te düzenli ifadeler (Regular Expressions veya kısaca RegExp), metin içindeki desenleri eşleştirmek, aramak, değiştirmek ve doğrulamak için güçlü bir araçtır. Bu kılavuz, JavaScript ortamında RegExp'in nasıl tanımlandığını ve kullanıldığını, temel sözdiziminden başlayarak çeşitli metotlarla pratik uygulamalarına kadar adım adım açıklamaktadır.

Temel Sözdizimi

JavaScript'te düzenli ifadeler iki ana şekilde oluşturulabilir: bir RegExp literal'i veya RegExp kurucusu kullanılarak.

Bir RegExp literal'i, deseni iki eğik çizgi (/) arasına alarak oluşturulur ve isteğe bağlı olarak sonuna bayraklar eklenir:

/desen/bayraklar

Bir RegExp kurucusu ise, deseni ve bayrakları string olarak alır:

new RegExp("desen", "bayraklar")

Literal kullanımı genellikle daha basit ve performanttır, ancak desenin veya bayrakların çalışma zamanında dinamik olarak oluşturulması gerektiğinde kurucu yöntemi tercih edilir.

Detaylı Açıklama

Yukarıdaki sözdiziminde yer alan desen ve bayraklar bileşenleri aşağıdaki gibi açıklanabilir:

• Desen (Pattern): Eşleştirilmek istenen karakter dizilerini veya kalıpları tanımlar. Bu, sabit karakterler, özel karakterler (örneğin, . herhangi bir karakteri eşleştirmek için), niceleyiciler (örneğin, + bir veya daha fazla kez eşleştirmek için) ve karakter sınıfları (örneğin, [0-9] bir rakamı eşleştirmek için) içerebilir.

  
  

• Bayraklar (Flags): Düzenli ifadenin eşleştirme davranışını değiştiren isteğe bağlı tek karakterlerdir. En yaygın kullanılan bayraklar şunlardır:

  
  

  • g (global): Desenin tüm eşleşmelerini bulur, ilk eşleşmeden sonra durmaz.

    
    

  • i (case-insensitive): Büyük/küçük harf duyarsız eşleştirme yapar.

    
    

  • m (multiline): Çok satırlı giriş dizilerinde ^ ve $ karakterlerinin her satırın başında ve sonunda eşleşmesini sağlar.

    
    

  • u (unicode): Deseni Unicode kod noktaları dizisi olarak ele alır.

    
    

  • s (dotAll): . (nokta) karakterinin satır sonu karakterleri dahil herhangi bir karakterle eşleşmesini sağlar.

    
    

  • d (hasIndices): Eşleşen alt dizelerin başlangıç ve bitiş indekslerini içeren bir dizi döndürür.

    
    
  
  

Pratik Kullanım Örnekleri

JavaScript'teki string metotları, düzenli ifadelerle birlikte kullanılarak metin üzerinde çeşitli işlemler yapılmasına olanak tanır. İşte bazı temel metotlar ve örnek kullanımları:

1. RegExp.prototype.test(): Bir string'de bir desenin bulunup bulunmadığını kontrol eder ve bir boolean değer döndürür.

const desen = /elma/;
const metin1 = "Bugün elma yedim.";
const metin2 = "Bugün armut yedim.";

console.log(desen.test(metin1)); // true
console.log(desen.test(metin2)); // false

2. String.prototype.match(): Bir string'de deseni arar ve tüm eşleşmeleri içeren bir dizi döndürür. g bayrağı yoksa sadece ilk eşleşmeyi döndürür.

const desen = /elma/g;
const metin = "Yeşil elma, kırmızı elma ve sarı elma.";

const eslesmeler = metin.match(desen);
console.log(eslesmeler); // ["elma", "elma", "elma"]

const desenBuyukKucuk = /Elma/gi; // Büyük/küçük harf duyarsız ve global
const eslesmelerBuyukKucuk = metin.match(desenBuyukKucuk);
console.log(eslesmelerBuyukKucuk); // ["elma", "elma", "elma"]

3. String.prototype.replace(): Bir string'deki desene uyan kısımları başka bir string ile değiştirir.

const desen = /elma/g;
const metin = "Yeşil elma, kırmızı elma.";

const yeniMetin = metin.replace(desen, "armut");
console.log(yeniMetin); // "Yeşil armut, kırmızı armut."

const desenRakamlar = /\d+/g; // Bir veya daha fazla rakamı eşleştir
const metinRakamlar = "Toplam 123 adet ürün, fiyat 45.67 TL.";

const yeniMetinRakamlar = metinRakamlar.replace(desenRakamlar, "XXX");
console.log(yeniMetinRakamlar); // "Toplam XXX adet ürün, fiyat XXX.XX TL."

4. String.prototype.search(): Bir string'de deseni arar ve ilk eşleşmenin indeksini döndürür. Eşleşme bulunamazsa -1 döndürür. g bayrağı bu metot için anlamsızdır.

const desen = /kırmızı/;
const metin = "Yeşil elma, kırmızı elma.";

const indeks = metin.search(desen);
console.log(indeks); // 12 (k harfinin indeksi)

const desenYok = /mavi/;
const indeksYok = metin.search(desenYok);
console.log(indeksYok); // -1

5. String.prototype.split(): Bir string'i, belirtilen bir desen veya karakter dizisi kullanarak bir diziye böler.

const desen = /\s*,\s*/; // Virgül etrafındaki boşlukları da yakalar
const metin = "elma, armut , muz, kiraz";

const meyveler = metin.split(desen);
console.log(meyveler); // ["elma", "armut", "muz", "kiraz"]

const desenKarakter = /a/g; // Her 'a' karakterinden böl
const kelime = "banana";
const parcalar = kelime.split(desenKarakter);
console.log(parcalar); // ["b", "n", "n", ""] (son 'a'dan sonra boş string)

İpuçları ve Önemli Notlar

• Kaçış Karakterleri: Özel anlamı olan karakterleri (örneğin, ., *, +, ?, ^, $, (, ), [, ], {, }, |, \) desen içinde literal olarak kullanmak isterseniz, önüne ters eğik çizgi (\) ekleyerek kaçış yapmalısınız. Örneğin, bir noktayı (.) eşleştirmek için /\./ kullanın.

  
  

• Dinamik Desenler: Deseni bir string'den oluşturuyorsanız (new RegExp("desen")), bu string içindeki kaçış karakterlerini (\) iki kez kaçış yapmanız gerekebilir (örneğin, new RegExp("\\d+")).

  
  

• Performans: Çok karmaşık veya verimsiz düzenli ifadeler, özellikle büyük metinler üzerinde çalışırken performans sorunlarına neden olabilir. Deseninizi mümkün olduğunca spesifik ve basit tutmaya çalışın.

  
  

• Stateful RegExp: g bayrağına sahip bir RegExp nesnesi, lastIndex özelliğini günceller. Aynı RegExp nesnesini birden fazla kez test() veya exec() ile çağırırsanız, eşleşmeler bir önceki çağrının bittiği yerden devam eder. Bu durum, beklenmedik sonuçlara yol açabilir, bu yüzden dikkatli olun veya her kullanımda yeni bir RegExp literal'i oluşturmayı düşünün.

  
  

• Online Araçlar: Düzenli ifadeleri test etmek ve geliştirmek için Regex101 veya RegExr gibi çevrimiçi araçları kullanmak, karmaşık desenleri anlamanıza ve hata ayıklamanıza yardımcı olabilir.