JavaScript Düzenli İfadeler için hızlı ve basit bir rehber

JavaScript öğrenmek ister misiniz? Jshandbook.com adresinden ücretsiz e-kitapmı edinin

Normal İfadelere Giriş

Düzenli bir ifade (kısaca regex de denir), metin dizeleriyle çalışmanın hızlı bir yoludur.

Özel bir sözdizimiyle düzenli bir ifade formüle ederek şunları yapabilirsiniz:

  • bir dizede metin aramak
  • dizgede alt dizeleri değiştir
  • ve bir dizeden bilgi almak

Hemen hemen her programlama dili, düzenli ifadelerin bazılarını içerir. Her uygulama arasında küçük farklılıklar vardır, ancak genel kavramlar hemen hemen her yere uygulanır.

Düzenli İfadeler, 1950'lere dayanır, bunlar dize işleme algoritmaları için kavramsal bir arama deseni olarak resmileştirilir.

UNIX araçlarında grep, sed ve popüler metin editörlerinde uygulanan regex'ler popülerlik kazanmıştır. Perl programlama diline, daha sonra da birçoklarına tanıtıldılar.

JavaScript, Perl ile birlikte, doğrudan dile yerleşik düzenli ifadeleri destekleyen programlama dillerinden biridir.

Sert ama kullanışlı

Düzenli ifadeler, yeni başlayanlar için mutlak bir saçmalık ve çoğu zaman da profesyonel geliştiriciye, onları anlamak için gereken zamana yatırım yapmazsanız görünebilir.

Kriptik düzenli ifadeler yazmak zor, okunması zor ve bakımı / değiştirilmesi zor.

Ancak bazen düzenli bir ifade, bazı dize manipülasyonu gerçekleştirmek için tek akılda kalıcı yoludur, bu yüzden cebinizde çok değerli bir araçtır.

Bu eğitimde, size JavaScript Düzenli İfadeleri basit bir şekilde tanıtmayı ve düzenli ifadeleri okumak ve oluşturmak için tüm bilgileri vermeyi amaçlamaktadır.

Temel kural şudur: basit düzenli ifadelerin okunması ve yazılması kolaydır, karmaşık temel ifadeler ise temelleri derinden kavramazsanız, çabucak bir karışıklığa dönüşebilir.

Normal İfade nasıl görünür?

JavaScript'te normal ifade, iki şekilde tanımlanabilen bir nesnedir.

Bunlardan ilki, yapıcıyı kullanarak yeni bir RegExp nesnesini başlatmasıdır:

const re1 = yeni RegExp ('hey')

İkincisi, normal ifade değişmez formunu kullanıyor:

const re1 = / hey /

JavaScript'in hazır bilgi nesnelerine ve hazır bilgi dizisine sahip olduğunu biliyor musunuz? Aynı zamanda regex değişmezleri vardır.

Yukarıdaki örnekte, hey deseni olarak adlandırılır. Edebi formda, eğik çizgilerle sınırlandırılmış, nesne yapıcı ile değil.

İki form arasındaki ilk önemli fark budur, ancak daha sonra başkalarını göreceğiz.

O nasıl çalışır?

Yukarıda re1 olarak tanımladığımız düzenli ifade, çok basit bir ifadedir. Herhangi bir sınırlama olmadan hey dizesini arar. Dize çok fazla metin içerebilir ve ortasındaki hey ve regex memnun. Ayrıca sadece hey içerebilir ve regex de tatmin olur.

Bu oldukça basit.

Regex'i, bir boole döndüren RegExp.test (String) kullanarak test edebilirsiniz:

re1.test ('hey') // 
re1.test ('blablabla hey blablabla') // 
re1.test ('he') // 
re1.test ('blablabla') // 

Yukarıdaki örnekte, "hey" ifadesinin re1 'de depolanan düzenli ifade modelini karşılayıp karşılamadığını kontrol ettik.

Olabileceği en basit şey bu, ama şimdi zaten regex'ler hakkında birçok kavram biliyorsunuz.

Demirleme

/Hey/

dizginin içine yerleştirildiği her yerde hey ile eşleşir.

Hey ile başlayan dizeleri eşleştirmek istiyorsanız, ^ operatörünü kullanın:

/^hey/.test('hey ') // 
/^hey/.test('bla hey ') // 

Hey ile biten dizgileri eşleştirmek istiyorsanız, $ operatörünü kullanın:

/hey$/.test('hey ') // 
/hey$/.test('bla hey ') // 
/hey$/.test('hey '' // 

Bunları birleştirin ve hey ile tam olarak eşleşen dizeleri ve yalnızca bu dizeyi eşleştirin:

/^hey$/.test('hey ') // 

Bir alt dize ile başlayan ve bir diğeriyle biten bir dize ile eşleşmek için, 0 veya daha fazla kez tekrarlanan herhangi bir karakterle eşleşen.

/^hey.*joe$/.test('hey joe ') // 
/^hey.*joe$/.test('heyjoe ') // 
/^hey.*joe$/.test('hey nasılsın '' // 
/^hey.*joe$/.test('hey joe! ') // 

Aralıktaki öğeleri eşleştir

Belirli bir dizeyi eşleştirmek yerine, aşağıdaki gibi bir aralıktaki herhangi bir karakterle eşleşmeyi seçebilirsiniz:

/ [a-z] / // a, b, c, ..., x, y, z
/ [A-Z] / // A, B, C, ..., X, Y, Z
/ [a-c] / // a, b, c
/ [0-9] / // 0, 1, 2, 3, ..., 8, 9

Bu regexes, bu aralıktaki karakterlerden en az birini içeren dizelerle eşleşir:

/LEXa-zLEX/.test('a ') // 
/LEXa-zLEX/.test('1 ') // 
/LEXa-zLEX/.test('A ') // 
/QLa-cLEX/.test('d ') // 
/QLa-cLEX/.test('dc ') // 

Aralıklar birleştirilebilir:

/ [A-Za-0-9] /
/LEXA-Za-z0-9LEX/.test('a ') // 
/QLA-Za-z0-9LEX/.test('1 ') // 
/LEXA-Za-z0-9LEX/.test('A ') // 

Bir aralık öğesini birden çok kez eşleştirme

Bir dizgenin aralıkta bir karakterden yalnızca bir karakter içerip içermediğini kontrol edebilirsiniz - char:

/ ^ [A-Za-0-9] $ /
/^CLA-Za-z0-9LEX$/.test('A ') // 
/^CLA-Za-z0-9LEX$/.test('Ab ') // 

Bir kalıbı olumsuzlamak

Bir kalıbın başındaki ^ karakteri onu bir dizgenin başlangıcına tutturur.

Bir aralık içinde kullanıldığında, bunu olumsuzlar.

/QL^A-Za-z0-9LEX/.test('a ') // 
/QL^A-Za-z0-9LEX/.test('1 ') // 
/Г^A-Za-z0-9LEX/.test('A ') // 
/QL^A-Za-z0-9LEX/.test('@ ') // 
  • \ d, [0-9] değerine eşdeğer herhangi bir rakamla eşleşir
  • \ D, basamağı olmayan herhangi bir karakterle eşleşir, [^ 0-9] değerine eşittir
  • \ w, [A-Za-z0-9] ile eşdeğer herhangi bir alfanümerik karakterle eşleşir
  • \ W, [^ A-Za-z0-9] değerine eşdeğer, alfasayısal olmayan herhangi bir karakterle eşleşir
  • \ 'herhangi bir boşluk karakteri ile eşleşir: boşluklar, sekmeler, yeni satırlar ve Unicode boşluklar
  • \ S, boşluk olmayan herhangi bir karakterle eşleşiyor
  • \ 0 null eşleşiyor
  • \ n yeni satır karakteriyle eşleşiyor
  • bir sekme karakteriyle eşleşiyor
  • \ uXXXX, XXXX kodlu unicode karakteriyle eşleşir (u bayrağını gerektirir)
  • . yeni satır karakteri olmayan herhangi bir karakterle eşleşir (ör. \ n) (s işaretini kullanmazsanız, daha sonra açıklanacaktır)
  • [^] yeni satır karakterleri dahil olmak üzere herhangi bir karakterle eşleşir. Çok satırlı dizelerde yararlıdır.

Düzenli ifade seçenekleri

Bir dize ya da diğerini aramak istiyorsanız, | Şebeke.

/hey|ho/.test('hey ') // 
/hey|ho/.test('ho ') // 

Niceleyiciler

Bir dizgenin içinde bir rakam olup olmadığını kontrol eden bu regex'e sahip olduğunuzu söyleyin:

/ ^ \ D $ /

Kullanabilirsiniz? isteğe bağlı olarak niteleyici, böylece sıfır veya bir değer gerektirir:

/ ^ \ D? $ /

peki ya birden fazla rakam eşleştirmek istiyorsanız?

+, *, {N} ve {n, m} tuşlarını kullanarak bunu 4 şekilde yapabilirsiniz. Bunlara birer birer bakalım.

+

Bir veya daha fazla (> = 1) öğe eşleştir

/ ^ \ D + $ /
/^\d+$/.test('12 ') // 
/^\d+$/.test('14 ') // 
/^\d+$/.test('144343 ') // 
/ ^ \ d + $ /. test ('') // 
/^\d+$/.test('1a ') // 

*

0 veya daha fazla öğe eşle (> = 0) öğe

/ ^ \ D + $ /
/^\d*$/.test('12 ') // 
/^\d*$/.test('14 ') // 
/^\d*$/.test('144343 ') // 
/ ^ \ d * $ /. test ('') // 
/^\d*$/.test('1a ') // 

{N}

Tam olarak n maddeyle eşle

/ ^ \ D {3} $ /
/^\d{3|$/.test('123 ') // 
/^\d{3|$/.test('12 ') // 
/^\d{3|$/.test('1234 ') // 
/^CLA-Za-z0-9LEX{3 Llo$/.test('Abc ') // 

{N, m}

N ile m arasındaki eşleşme:

/ ^ \ D {3,5} $ /
/^\d{3,5|$/.test('123 ') // 
/^\d{3,5|$/.test('1234 ') // 
/^\d{3,5|$/.test('12345 ') // 
/^\d{3,5|$/.test('123456 ') // 

m açık bir son olması için atlanabilir, bu nedenle en az n öğeniz var:

/ ^ \ D {3} $ /
/^\d{3,|$/.test('12 ') // 
/^\d{3,|$/.test('123 ') // 
/^\d{3,|$/.test('12345 ') // 
/^\d{3,|$/.test('123456789 ') // 

Isteğe bağlı öğeler

Bir öğeyi takip ediyor musunuz? isteğe bağlı yapar:

/ ^ \ D {3} \ W? $ /
/^\d{3 \$??///.t.t.t.t.t
/^\d{3 \$??///.t.t.t
/^\d{3 \$??///.t.t.t.t.t

Gruplar

Parantez kullanarak karakter grupları oluşturabilirsiniz: (...)

Bu örnek, bir veya daha fazla alfanümerik karakterin izlediği tam olarak 3 rakamla eşleşir:

/ ^ (\ D {3}) (\ w +) $ /
/^(\d{3 м)(\w+)$/.test('123 ') // 
/^(\d{3 м)(\w+)$/.test('123s ') // 
/^(\d{3 м)(\w+)$/.test('123something ') // 
/^(\d{3 м)(\w+)$/.test('1234 ') // 

Bir grup parantez kapanışından sonraki tekrarlanan karakterler bütün gruba aittir.

/ ^ (\ D {2}) + $ /
/^(\d{2 м)+$/.test('12 ') // 
/^(\d{2 м)+$/.test('123 ') // 
/^(\d{2 м)+$/.test('1234 ') // 

Yakalama grupları

Şimdiye kadar, dizelerin nasıl test edileceğini ve belirli bir patern olup olmadığını kontrol etmeyi gördük.

Düzenli ifadelerin çok havalı bir özelliği, bir dizgenin bölümlerini yakalama ve diziye koyma yeteneğidir.

Bunu Grupları ve özellikle de Yakalama Gruplarını kullanarak yapabilirsiniz.

Varsayılan olarak, bir Grup Yakalama Grubu'dur. Şimdi, eğer model tatmin olmuşsa sadece bir boole döndüren RegExp.test (String) kullanmak yerine, String.match (RegExp) veya RegExp.exec (String) 'i kullanırız.

Bunlar tamamen aynıdır ve ilk öğedeki tüm eşleşen dizenin ardından eşleşen her gruba sahip bir Dizi, ardından her bir grup içeriği döndürür.

Eşleşme yoksa, null değerini döndürür:

'123s'.match (/ ^ (\ d {3}) (\ w +) $ /)
// ["123s", "123", "s" dizileri]
) /^(\d{3})(\w+)$/.exec('123s
// ["123s", "123", "s" dizileri]
'Hey'.match (/ (hey | ho) /)
// Dizi ["hey", "hey"]
/(hey|ho)/.exec('hey ')
// Dizi ["hey", "hey"]
/(hey|ho)/.exec('ha! ')
//boş

Bir grup birden çok kez eşlendiğinde, sonuç dizisine yalnızca son eşleşme konur:

'123456789'.match (/ (\ d) + /)
// ["123456789", "9" dizisi]

İsteğe bağlı gruplar

(...)? Kullanılarak bir yakalama grubu isteğe bağlı yapılabilir. Bulunmazsa, sonuçtaki dizi yuvası tanımsız içerir:

/^(\d{3 м)(\s)?(\w+)$/.exec('123 s ')
// ["123 s", "123", "", "s" dizisi]
) /^(\d{3})(\s)?(\w+)$/.exec('123s
// ["123s", "123", undefined, "s" dizisi]

Referans eşleşen gruplar

Eşleşen her gruba bir numara atanır. 1 $, birinci, 2 $ ve benzeri şeyleri ifade eder. Bu daha sonra bir dizenin parçalarını değiştirmek hakkında konuştuğumuzda faydalı olacaktır.

Adlı yakalama grupları

Bu yeni bir ES2018 özelliğidir.

Bir gruba, sonuçtaki dizide bir yuvaya atanmak yerine bir ada atanabilir:

const re = / (?  \ d {4}) - (?  \ d {2}) - (?  \ d {2}) /
const sonucu = re.exec ('2015-01-02')
// result.groups.year === '2015';
// result.groups.month === '01';
// result.groups.day === '02';

Match ve exec işlemlerini gruplar olmadan kullanma

Match ile exec grubu çalıştırmadan gruplar arasında bir fark vardır: dizideki ilk öğe eşleşen dizenin tamamı değil, doğrudan eşleşmedir:

/hey|ho/.exec('hey ')
// [ "Hey" ]
/(hey).(ho)/.exec('hey ho ')
// ["hey ho", "hey", "ho"]

Yakalamayan gruplar

Varsayılan gruplar tarafından Yakalama Grupları olduğu için, sonuçtaki dizideki bazı grupları yoksaymanın bir yoluna ihtiyacınız vardır. Bu, bir (?: ...) ile başlayan Yakalamayan Gruplar kullanılarak mümkündür.

'123s'.match (/ ^ (\ d {3}) (: \ ler) i (\ w +) $ /)
//boş
'123 s'.match (/ ^ (\ d {3}) (?: \ S) (\ w +) $ /)
// ["123 s", "123", "s" dizisi]

Bayraklar

Herhangi bir normal ifadede aşağıdaki bayrakları kullanabilirsiniz:

  • g: desenle birden çok kez eşleşiyor
  • i: regex davasını duyarsız kılıyor
  • m: Çok satırlı modu etkinleştirir. Bu modda, ^ ve $ tüm dizenin başlangıcı ve bitişiyle eşleşir. Bu olmadan, çok satırlı dizelerle her satırın başlangıcı ve bitişi ile eşleşirler.
  • u: unicode desteği sağlar (ES6 / ES2015'te tanıtılmıştır)
  • s: (ES2018’de yeni), tek satır için kısa, buna neden olur. yeni çizgi karakterleri de eşleştirmek için.

Bayraklar birleştirilebilir ve dizgenin sonuna regex değişmezlerinde eklenirler:

/hey/ig.test('HEy ') // 

veya RegExp nesne yapıcılarının ikinci parametresi olarak:

Yeni RegExp ('hey', 'ig'). sınama ('HEy') // 

Bir regex incelemek

Bir regex verildiğinde, özelliklerini inceleyebilirsiniz:

  • desen dizesini kaynakla
  • m bayrağı ile multiline true
  • g bayrağı ile global doğru
  • ignoreCase, i bayrağıyla doğru
  • lastIndex
/^(\w{3 м)$/i.source // "^ (\\ d {3}) (\ w +) $"
/^(\w{3 м)$/i.multiline // false
/^(\w{3 м)$/i.lastIndex // 0
/^(\w{3 м)$/i.ignoreCase // true
/^(\w{3 м)$/i.global // false

kaçan

Bu karakterler özel:

  • \
  • /
  • []
  • ()
  • {}
  • ?
  • +
  • *
  • |
  • .
  • ^
  • $

Özeldirler çünkü normal ifade düzeninde bir anlamı olan kontrol karakterleridirler. Bunları kalıbın içinde eşleşen karakterler olarak kullanmak istiyorsanız, ters eğik çizgi hazırlayarak onlardan kaçmanız gerekir:

/ ^ \\ $ /
/ ^ \ ^ $ / // /^\^$/.test('^ ') 
/ ^ \ $$ / // /^\$$/.test('$ ') 

Dize sınırları

\ b ve \ B bir dizgenin bir kelimenin başında mı yoksa sonunda mı olduğunu kontrol etmenizi sağlar:

  • \ b, bir kelimenin başında veya sonunda bulunan bir karakter grubuyla eşleşir
  • \ B, bir kelimenin başında veya sonunda olmayan bir karakter grubuyla eşleşir

Örnek:

'Bir ayı gördüm'.match (/ \ bbear /) // Array ["bear"]
'Bir sakal gördüm'. Eşleşiyor (/ \ bbear /) //
'Bir sakal gördüm'.match (/ \ bbear \ b /) // null
'cool_bear'.match (/ \ bbear \ b /) // boş

Normal İfadeler kullanarak değiştirin

Bir dizginin desen içerip içermediğini nasıl kontrol edeceğimizi zaten gördük.

Ayrıca bir dizenin parçalarının bir diziye nasıl çıkarılacağını, bir kalıbın eşleşmesini de gördük.

Bir desene dayanarak bir dizenin parçalarının nasıl değiştirileceğini görelim.

JavaScript'teki String nesnesinin, bir dizede tek bir değiştirme gerçekleştirmek için normal ifadeler olmadan kullanılabilen bir replace () yöntemi vardır:

"Merhaba dünya!". ('Dünya', 'köpek')
//Merhaba Köpek!
"Köpeğim iyi bir köpektir!" Yerine ('köpek', 'kedi')
// Kedim iyi bir köpektir!

Bu yöntem ayrıca normal bir ifadeyi argüman olarak kabul eder:

"Merhaba dünya!". Değiştirin (/ dünya /, 'köpek') // Merhaba köpek!

G bayrağını kullanmak, bir dizgideki çoklu oluşumları vanilya JavaScript'te değiştirmenin tek yoludur:

"Köpeğim iyi bir köpektir!" Yerine (/ dog / g, 'cat')
// Kedim iyi bir kedi!

Gruplar, bir dizgenin bölümleri arasında dolaşmak gibi daha fazla şey yapmamıza izin verir:

"Merhaba dünya!" (Yerine (/ (\ w +), (\ w +)! /, '$ 2: $ 1 !!!')
// "dünya: Merhaba !!!"

Bir dize kullanmak yerine, daha da güzel şeyler yapmak için bir işlevi kullanabilirsiniz. String.match (RegExp) veya RegExp.exec (String) tarafından döndürülenler gibi bir dizi bağımsız değişken alacak ve grup sayısına bağlı olarak birkaç argüman alacak:

"Merhaba dünya!". (/ (\ W +), (\ w +)! /, (EşleşmeString, birinci, ikinci) => {
  console.log (ilk);
  console.log (saniye);
  return $ $ {second.toUpperCase ()}: $ {first} !!! `
})
// "DÜNYA: Merhaba !!!"

açgözlülük

Normal ifadelerin varsayılan olarak açgözlü olduğu söylenir.

Bunun anlamı ne?

Bu regex al:

/\$(.+)\s?/

Bir dizeden bir dolar tutarı çıkarması gerekiyordu:

/\$(.+)\s?/.exec('Bu maliyeti 100 $ 'dır) [1]
//100

ama sayıdan sonra daha fazla kelimemiz varsa, çıldırır:

/\$(.+)\s?/.exec('Bu 100 $ 'lık ve 200 $' dan az ') [1] // 100 $ ve 200 $' dan az

Neden? Çünkü $ işaretinden sonraki regex. + İle herhangi bir karakterle eşleşir ve dizenin sonuna gelinceye kadar durmaz. Sonra, bitti çünkü \ s? bitiş alanını isteğe bağlı yapar.

Bunu düzeltmek için, regex'in tembel olduğunu söylememiz ve mümkün olan en az miktarda eşleştirmeyi yapmamız gerekir. Bunu kullanarak yapabiliriz? miktar belirleyiciden sonraki simge:

/\$(.+?)\s/.exec('Bu 100 $ 'dır ve 200 $' dan azdır.) [1]
//100
Kaldırdım? sonra s. Aksi halde, alan isteğe bağlı olduğundan yalnızca ilk sayıya uyuyordu.

Yani, ? hem kantitatif hem de tembel mod göstergesi olabileceğinden, konumuna bağlı olarak farklı şeyler anlamına gelir.

Lookaheads: izleyenlere bağlı olarak dizeyle eşleş

? = Öğesini kullanarak belirli bir alt dizinin izlediği bir dizeyle eşleştirmek için:

/ Roger (? = Waters) /
/ Roger (? = Sular) /. Testi ('Roger benim köpeğimdir') // false
/ Roger (? = Waters) /. Testi ('Roger benim köpeğim ve Roger Waters ünlü bir müzisyen')
//doğru

?! Bir dizgeyi belirli bir alt dizenin izlememesi durumunda eşleştirerek ters işlemi gerçekleştirir:

/ Roger (?! Waters) /
/ Roger (?! Waters) /. Testi ('Roger benim köpeğim') // true
/ Roger (?! Waters) /. Testi ('Roger Waters ünlü bir müzisyendir')
//yanlış

Lookbehinds: ondan önce gelenlere bağlı olarak bir dizge eşleştir

Bu bir ES2018 özelliğidir.

Lookaheads? = Sembolünü kullanır. Görünüşe göre kullanım? <=.

/ (? <= Roger) Sular /
/ (? <= Roger) Waters / .test ('Pembe Sular benim köpeğimdir')
//yanlış
/ (? <= Roger) Waters / .test ('Roger benim köpeğim ve Roger Waters ünlü bir müzisyen')
//doğru

Bir lookbehind,

/ (? 
/ (? 
/ (? 

Normal ifadeler ve Unicode

Unicode dizeleriyle çalışırken u bayrağı zorunludur. Özellikle, astral düzlemlerdeki karakterleri (ilk 1600 Unicode karakterlerine dahil olmayanlar) işlemeniz gerekebilir.

Emojiler iyi bir örnektir, ancak sadece onlar değil.

Bu bayrağı eklemezseniz, bir karakterle eşleşmesi gereken bu basit regex işe yaramaz, çünkü JavaScript için emojinin dahili olarak 2 karakterle temsil edilmesi gerekir (bkz. JavaScript'te Unicode):

/^.$/.test('a ') // 
/^.$/.test(' ') // 
/^.$/u.test(' ') // 

Yani, her zaman u bayrağını kullanın.

Unicode, tıpkı normal karakterler gibi

/LEXa-zLEX/.test('a ') // 
/FF1-9UZ/.test('1 ') // 
/Г-LEX/u.test(' ') // 
/Г-LEX/u.test(' ') // 

JavaScript dahili kod gösterimini kontrol eder, bu yüzden < < çünkü \ u1F436 <\ u1F43A <\ u1F98A. Bu kodları almak ve sırayı bulmak için tüm Emoji listesini kontrol edin (ipucu: macOS Emoji seçicinin karışık bir düzende bazı emojileri var, bu yüzden hesaba katmayın).

Unicode özelliği kaçar

Yukarıda gördüğümüz gibi, normal ifade biçiminde, herhangi bir rakamla eşleştirmek için \ d, beyaz boşluk olmayan herhangi bir karakterle eşleştirmek için \ d, alfanümerik bir karakterle eşleştirmek için, vb. Kullanabilirsiniz.

Unicode özelliği kaçar, bu konsepti \ p {} ve olumsuzlamasını \ P {} tanıtan tüm Unicode karakterlerine genişleten çok hoş bir özellik sunan bir ES2018 özelliğidir.

Herhangi bir Unicode karakterin bir dizi özelliği vardır. Örneğin, Script dil ailesini belirler, ASCII, ASCII karakterleri için geçerli olan bir boolean vb. Bu özelliği grafik parantez içine alabilirsiniz; regex bunun doğru olup olmadığını kontrol eder:

/^\p{ASCIIال+$/u.test('abc ') // 
/^\p{ASCIIال+$/u.test('ABC@ ') // 
/^\p{ASCIIال+$/u.test('ABC ') // 

ASCII_Hex_Digit, dizgenin sadece geçerli onaltılık sayılar içerip içermediğini kontrol eden başka bir boolean özelliktir:

/^\p{ASCII_Hex_Digit|+$/u.test('0123456789ABCDEF ') //  /1>

Büyük harf, küçük harf, White_Space, Alfabetik, Emoji ve daha fazlası dahil olmak üzere, grafik parantezlerine adlarını ekleyerek kontrol ettiğiniz birçok boolean özellik vardır:

/^\p{Lowercase|$/u.test('h ') // 
/^\p{Uppercase|$/u.test('H ') // 
/^\p{Emoji Instagram Hesabındaki Resim ve Videoları
/^\p{Emoji + $} / u / ).test(' ') // 

Bu ikili özelliklere ek olarak, belirli bir değerle eşleşmesi için unicode karakter özelliklerinden herhangi birini kontrol edebilirsiniz. Bu örnekte, dizginin Yunanca mı yoksa Latin alfabesiyle mi yazıldığını kontrol ediyorum:

/^\p{Script=Greek м+$/u.test('ελληνικά ') // 
/^\p{Script=Latin м+$/u.test('hey ') // 

Doğrudan teklifte kullanabileceğiniz tüm özellikler hakkında daha fazla bilgi edinin.

Örnekler

Bir dizgenin çıkarmanız gereken tek bir sayı olduğunu varsayalım, / \ d + / bunu yapmalı:

'Test 123123329'.match (/ \ d + /)
// Dizi ["123123329"]

Bir e-posta adresini eşleştir

Basit bir yaklaşım boşluksuz karakterleri \ işaretini kullanarak @ işaretinden önce ve sonra kontrol etmektir.

/(\S+)@(\S+)\.(\S+)/
/(\S+)@(\S+)\.(\S+)/.exec('copesc@gmail.com ')
//Г"copesc@gmail.com "," copesc "," gmail "," com "]

Ancak bu basit bir örnektir, çünkü birçok geçersiz e-posta bu regex tarafından hala karşılanmaktadır.

Çift tırnak işaretleri arasında metin yakalama

İkili tırnak içinde bir şey içeren bir dizeniz olduğunu ve bu içeriği çıkarmak istediğinizi varsayalım.

Bunu yapmanın en iyi yolu bir yakalama grubu kullanmaktır, çünkü maçın başladığını ve bittiğini biliyoruz ", ve kolayca hedefleyebiliriz, ancak bu teklifleri sonuçlarımızdan kaldırmak istiyoruz.

Sonuçta ihtiyacımız olanı bulacağız [1]:

const hello = 'Merhaba "güzel çiçek"'
const sonucu = /"(-)^'idos*)"/.exec(hello)
// Dizi ["\" güzel çiçek \ "", "güzel çiçek"]

Bir HTML etiketinin içindeki içeriği alın

Örneğin, bir yayılma etiketinin içindeki içeriği alın ve etiketin içinde herhangi bir sayıda bağımsız değişken bulunmasına izin verin:

/]*>(.*?)<\/span>/
/]*>(.*?)<\/span>/.exec('test ')
// boş
/ ] *> (. *?) <\ / Span> /. Exec ( ' Test ')
// [" test ", "test"]
/ EUROP*>(.*?)<\/span>/.exec(' test  ')
// [" test ", "test"]
JavaScript öğrenmek ister misiniz? Jshandbook.com adresinden ücretsiz e-kitapmı edinin