Javascript RegExp, Düzenli ifadeler anlamına gelen regular expression ile arama yapabilir, metin değişikliği yapabilir, kullanıcının girdiği verilerin doğruluğu ile ilgili kontroller yapılabilir. Günümüzde genel anlamıyla web sitelerinde veri doğruluğu ile ilgili kontrollerde sıklıkla kullanılmaktadır.

İçerik göster

Javascript RegExp Nedir, Veri Doğrulama, Değiştirme, Arama Nasıl Yapılır?

Javascript RegExp Nedir, Veri Doğrulama, Değiştirme, Arama Nasıl Yapılır? Metin arama, değiştirme işlemlerinde düzenli ifadeler desenlerini kullanacağız ve bu desenlerin neler olduğunu detaylı bir şekilde göreceğiz. Düzenli ifadeler tek karakterden yada daha karmaşık ifadelerden oluşabilir. Makalenin bundan sonraki kısmında Regular Expression yani düzenli ifadelerden regexp diye bahsedilecektir.

Örnek sözdizimi

var regexp = /desen/duzenleyiciler;

1	var regexp = /desen/duzenleyiciler;

veya

var regexp = new RegExp("desen","duzenleyiciler");

1	var regexp = new RegExp("desen","duzenleyiciler");

Örnek

var patt = /muratoner/i;

1	var patt = /muratoner/i;

Örneği açıklayalım; /muratoner/i regexp’dir. muratoner desendir(aramada kullanılacak metin) i düzenleyici karakteri(harf duyarlılığını iptal eder yani aramada küçük büyük harf ayrımı olmaz)

String Metodlarını Kullanma

Regexp için Javascript’de 3 tane string metodunu kullanacagız. Bunlar search, replace ve match metodlarıdır. Adındanda kolayca anlaşılacağı üzere search metodunu arama yapmak ve replace metodunu değişiklik yapmak ve match metodunu eşleştirme yapmak(çoklu arama) için kullanacağız.

Search

search metodu aradığımız string değerin tam metin içerisindeki index konumunu verir. search metodu tek parametre almaktadır ve arama işlemini regexp yazarak gerçekleştirebiliyoruz. Şimdi örnek bir search metodu yazalım.

var str = "benim sitem MuratOner.net";
var n = str.search(/muratoner/i);

1 2	var str = "benim sitem MuratOner.net"; var n = str.search(/muratoner/i);

Üstteki kodda aramak istediğimiz kelime bir kısmı cümle içerisinde MuratOner diye geçmektedir fakat biz muratoner diye yazdık bu şekilde yazma sebebimde i düzenleyici karakterini ekleyerek büyük-küçük harf duyarlılığını kapattım eğer i düzenleyicisini eklemeseydim -1 değeri dönecekti. Sonuç olarak search metodu bana 12 değerini döndericek sebebi ise aradığım muratoner kelimesi 12.index’ten itibaren başlıyor. Regexp ifadesi kullanmadanda arama işlemini gerçekleştirebilirsiniz. Şimdi regexp kullanmadan arama işlemini yapalım.

var str = "benim sitem MuratOner.net";
var n = str.search("MuratOner");

1 2	var str = "benim sitem MuratOner.net"; var n = str.search("MuratOner");

Replace

replace metodunun ilk parametresine gireceğimiz regexp deseni ile elde edeceğimiz string değerler ikinci parametrede belirttiğimiz değer ile değiştirmek için kullanabileceğimiz metot’dur. Hemen bir örnek ile anlattığım durumu pekiştirelim.

var str = "Ben Öner!";
var res = str.replace(/öner/i, "Murat");

1 2	var str = "Ben Öner!"; var res = str.replace(/öner/i, "Murat");

Replace metodunda regexp kullanmak zorunda değilsiniz direk olarak değiştirmek istediğiniz string değeri belirtip değiştirebilirsiniz yukarıdaki örneği regexp kullanmadan gerçekleştirelim.

var str = "Ben Öner!";
var res = str.replace("Öner", "Murat");

1 2	var str = "Ben Öner!"; var res = str.replace("Öner", "Murat");

Gördüğünüz gibi herhangi bir regexp ifadesi kullanmadanda değiştirme işlemi gerçekleştrebiliyorsunuz.

Match

Tek parametre alan match adlı metoda regexp desenini istersenix RegExp adlı sınıftan instance alarak yada direk olarak regexp desenlerini yazarakda kullanabilirsiniz. Şimdi bir örnek ile bu durumu netleştirelim.

var str = 'Daha fazla bilgi için, Bakınız bölümler: 3.4.5.1';
var re = /bakınız (bölümler: \d+(\.\d)*)/i;
var bulundu = str.match(re);

console.log(bulundu);

// loglar [ 'Bakınız bölümler: 3.4.5.1',
//        'bölümler: 3.4.5.1',
//        '.1',
//        index: 22,
//        input: 'Daha fazla bilgi için, Bakınız bölümler: 3.4.5.1' ]

// 'Bakınız bölümler: 3.4.5.1' eşleşen değer.
// 'bölümler: 3.4.5.1' değeri '(chapter \d+(\.\d)*)' deseni ile yakalandı.
// '.1' değeri ise '(\.\d)' deseni ile yakalandı.
// 'index' değerinin 22 çıkması eşleşmenin 22 index değerinden başladığını göstermektedir.
// 'input' regexp işlemine tabi tutulan giriş değeridir.

var str = 'Daha fazla bilgi için, Bakınız bölümler: 3.4.5.1';

var re = /bakınız (bölümler: \d+(\.\d)*)/i;

var bulundu = str.match(re);

console.log(bulundu);

// loglar [ 'Bakınız bölümler: 3.4.5.1',

// 'bölümler: 3.4.5.1',

// '.1',

// index: 22,

// input: 'Daha fazla bilgi için, Bakınız bölümler: 3.4.5.1' ]

// 'Bakınız bölümler: 3.4.5.1' eşleşen değer.

// 'bölümler: 3.4.5.1' değeri '(chapter \d+(\.\d)*)' deseni ile yakalandı.

// '.1' değeri ise '(\.\d)' deseni ile yakalandı.

// 'index' değerinin 22 çıkması eşleşmenin 22 index değerinden başladığını göstermektedir.

// 'input' regexp işlemine tabi tutulan giriş değeridir.

match metodu ile eşleşen hiçbir kayıt bulunmaz ise null değeri dönecektir fakat eşleşen değer olursa array olarak sonuç dönecektir. Match metodunu daha basit bir örnek ile açıklamaya çalışalım.

var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
var regexp = /[A-E]/gi;
var eslesen_array = str.match(regexp);

console.log(eslesen_array);
// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']

var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';

var regexp = /[A-E]/gi;

var eslesen_array = str.match(regexp);

console.log(eslesen_array);

// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']

Global ve ignore-case düzenleyicilerini kullanarak ve [A-E] deseni ile büyük harflerden A’dan E’ye kadarki kısım ve küçük harflerden a’dan e’ye kadar olan kısım array içerisinde dönecektir üstteki örnekte yorumlanmış son satırda dönen sonuç görülmektedir.

Javascript RegExp Düzenleyicileri

Düzenleyiciler	Açıklama
g	Arama işlemini tüm metin içerisinde yapacaktır.
i	Büyük-küçük harf duyarlılığı bu düzenleyici kullanıldığında kapatılmaktadır.
m	Çok satırlı metniniz varsa ve aramanın tüm satırda yapılması isteniyorsa kullanılacak düzenleyicidir.
u	Unicode karakter setlerini desteklemesini istiyorsanız bunuda düzenleyecilere eklemelisiniz özellikle türkçe karakterler üzerinde işlem yapacaksanız bunu eklemelisiniz.

RegExp Desenleri

Köşeli parantezler karakter aralığı bulmak için kullanılır.

Desen	Açıklama
[abc]	Köşeli parentezler içerisindeki herhangi bir karakteri arar.
[0-9]	Köşeli parantezler içerisindeki 0 ile 9 arasındaki dijital sayıları arar.
(x\|y)	x veya y karakterini arar( \| karakteri veya anlamına gelmektedir.)

Özel anlamları olan metakarakterler

Metakarakter	Açıklama
\d	Sayı arama
\s	Boşluk karakteri arama
\b	Bir kelimenin başında veya sonunda eşleşme bulmak.
\uxxxx	xxxx hexadecimal numaraları ile özel Unicode karakterleri arama

Javascript RegExp Özellikleri

global, multiline, ignoreCase

Düzenleyicilerin desen içerisinde kullanılıp kullanılmadığı ile ilgili bilgiye regex özellikleri ile erişebiliyoruz. Bu özellikler global, multiline ve ignoreCase’dir. Şimdi bununla ilgili bir örnek yapalım.

(function(){
    var str = "şuan muratoner.net'in sitesindesiniz.";
    var res = new RegExp("murat","ig");
    if(res.global){
        document.write("Global düzenleyicisi kullanılmıştır.");
    }else{
        document.write("Global düzenleyicisi kullanılmamıştır.");
    }
    document.write("<br/>");
    if(res.multiline){
        document.write("Multiline düzenleyicisi kullanılmıştır.");
    }else{
        document.write("Multiline düzenleyicisi kullanılmamıştır.");
    }
    document.write("<br/>");
    if(res.ignoreCase){
        document.write("IgnoreCase düzenleyicisi kullanılmıştır.");
    }else{
        document.write("IgnoreCase düzenleyicisi kullanılmamıştır.");
    }
})();

(function(){

var str = "şuan muratoner.net'in sitesindesiniz.";

var res = new RegExp("murat","ig");

if(res.global){

document.write("Global düzenleyicisi kullanılmıştır.");

}else{

document.write("Global düzenleyicisi kullanılmamıştır.");

}

document.write("<br/>");

if(res.multiline){

document.write("Multiline düzenleyicisi kullanılmıştır.");

}else{

document.write("Multiline düzenleyicisi kullanılmamıştır.");

}

document.write("<br/>");

if(res.ignoreCase){

document.write("IgnoreCase düzenleyicisi kullanılmıştır.");

}else{

document.write("IgnoreCase düzenleyicisi kullanılmamıştır.");

}

})();

global, multiline ve ignoreCase özellikleri boolean değer döndermektedir geriye.

input

RegExp işleminde kullanılan tam metine bu özellik üzerinden erişebilirsiniz. Üstteki örnekte özelliklere RegExp sınıfından aldığımız örnek ile yani res değişkeni üzerinden erişmiştik özelliklere. input özelliği static tipli bir özelliktir bu özelliğe erişmek için res değişkenini değil direk olarak RegExp.input sınıf adı üzerinden erişimi sağlayacağız.

var str = "şuan murat öner'in sitesindesiniz.";
var regexp = new RegExp("öner","ig");
regexp.test(str);
document.write(RegExp.input);

var str = "şuan murat öner'in sitesindesiniz.";

var regexp = new RegExp("öner","ig");

regexp.test(str);

document.write(RegExp.input);

Üstteki örneğin çıktısı olarak sayfaya Şuan murat öner’in sitesindesiniz. yazdırılacaktır.

lastIndex

Adındanda anlaşılacağı üzere eşleşmenin en son karakterinin index değerini bize dönderecektir. Bir üstteki örnek üzerinden devam edersek regexp deseni olarak öner girmiştik şimdi öner deseni ile eşleşmenin son karakteri olan r karakterinin index değeri kaçmış görelim. lastIndex özelliğine regexp adlı değişken üzerinden erişeceğiz.

var str = "şuan murat öner'in sitesindesiniz.";
var regexp = new RegExp("öner","ig");
regexp.test(str);
document.write(regexp.lastIndex);

var str = "şuan murat öner'in sitesindesiniz.";

var regexp = new RegExp("öner","ig");

regexp.test(str);

document.write(regexp.lastIndex);

Örneği çalıştırdığınızda öner deseninin son karakteri olan r karakterinin index değeri olan 15 değerini döndüğünü göreceksiniz.

leftContext

desen eşleşmesinin solunda kalan kısmı dönecektir üstteki örnek üzerinden gidersek bize dönecek sınuç şuan murat tır

var str = "şuan murat öner'in sitesindesiniz.";
var regexp = new RegExp("öner","mig");
regexp.test(str);
document.write(RegExp.leftContext);

var str = "şuan murat öner'in sitesindesiniz.";

var regexp = new RegExp("öner","mig");

regexp.test(str);

document.write(RegExp.leftContext);

rightContext

desen eşleşmesinin sağında kalan kısmı dönecektir üstteki örnek üzerinden gidersek bize dönecek sınuç ‘in sitesindesiniz. ‘dir

var str = "şuan murat öner'in sitesindesiniz.";
var regexp = new RegExp("öner","mig");
regexp.test(str);
document.write(RegExp.rightContext);

var str = "şuan murat öner'in sitesindesiniz.";

var regexp = new RegExp("öner","mig");

regexp.test(str);

document.write(RegExp.rightContext);

Kullanım Örnekleri

Tam kelime eşleştirmesi sağlama uzunca bir metninin var ve bir kelime içerisindeki metni yada ekleri değilde sadece ilgili kelimenin kendisini bulmak istiyorsanız \b regex kodunu başına ve sonuna kullanarak arasına girmiş olduğunuz ve kelime ve metni birebir eşleştirme yaparak arama sağlayabilirsiniz. Şimdi örneğe bakalım.

var res = "Burası Murat Öner'in sitesidir.".match(/\bMurat ÖNER\b/igu)

1	var res = "Burası Murat Öner'in sitesidir.".match(/\bMurat ÖNER\b/igu)

Üstteki kod sonucunda bize sadece Murat Öner kısmının olduğu bir array nesnesi dönecek eğer aradığınız şey birden fazla yer alsaydı o zaman tümü gelecekti dikkat ettiyseniz regex düzenleyicilerinde i,g ve u karakterlerini kullandık bunların anlamları Regex Düzenleyicileri kısmında yer alıyor.

📚 Javascript RegExp Benzeri Makaleler

✍ Lütfen olumlu-olumsuz tüm görüşlerinizi bana yorum yada mail yolu ile iletmeyi ihmal etmeyin.

🔗 Sosyal medya kanallarından makaleyi paylaşarak destek olursanız çok sevinirim.

👋 Bir sonraki makalede görüşmek dileğiyle.

5/5 - (3 votes)

Ali GÖREN dedi ki:
1 Haziran 2017, 11:28
Basit olarak telefonları numerik olmayacak şekilde formatlayan bir regex kodu şöyle (Bu regexpte pluginlerden çıkan değer varsayılan olarak kullanılmıştır):
var txtTelefon = ‘(555) 555-55-55)’.replace(/[) (_-]/g, ”)
Yanıtla
- Murat ÖNER dedi ki:
  3 Haziran 2017, 14:37
  Teşekkür ederiz paylaşımınız için
  Yanıtla

Kategoriler

Bloga e-posta ile abone ol

Javascript RegExp Nedir, Veri Doğrulama, Değiştirme, Arama Nasıl Yapılır?