Regex i JavaScript | Forklart med eksempler

Når en utvikler først legger øynene opp for vanlige uttrykk eller regex virker det gibberish. Imidlertid kan de se ut, vanlige uttrykk er ekstremt nyttige og gjør deg til en effektiv programmerer. Regex -konseptet er litt komplisert, men i dette innlegget vil vi lede deg gjennom enkle trinn sammen med eksempler for å hjelpe deg med å mestre regex i JavaScript.

Hva er regex i JavaScript?

Regex eller vanlig uttrykk er ganske enkelt en streng som definerer et mønster og er veldig nyttig for å finne et mønster i en streng eller erstatte en streng med et matchet mønster. For å si det enkelt, anta at du vil validere en e -postadresse eller telefonnummer med et spesifisert mønster, så kommer Regex godt med.

Regex syntaks:

var myRegex = /abc /;

Vi omslutter et mønster i fremre skråstrek “/” som vist ovenfor. Vi kan også bruke Regexp Konstruktør for å definere et regex -mønster:

var myRegex = new regexp ('abc');

Nå som vi vet hva regex er og hva som er syntaks, la oss nå se hvordan vi kan spesifisere et mønster ved hjelp av regex i JavaScript.

Spesifiser mønster ved hjelp av regex

For å spesifisere mønstre ved hjelp av regex bruker vi metakarakter som er karakterer som har spesiell betydning. Metacharacters og hva de representerer i Regex er gitt i tabellen nedenfor:

Metakarakter	Hva gjør den?
[] (Firkantede parenteser)	Uansett hva vi skriver i de firkantede parentesene vil bli matchet med en gitt streng. For eksempel [ABC] Matcher a, b, og c tegn med en spesifisert streng. Vi kan også spesifisere et område for eksempel [A-f] er det samme som [A B C D E F] eller [1-5] er det samme som [12345].
^ (Caret Symbol)	Vaktsymbolet brukes til å sjekke om en spesifisert tekst eller streng starter med et bestemt tegn eller ikke e.g. ^a Kamper med ABC Imidlertid ^a samsvarer ikke med Bac. Vaktsymbolet innen firkantede parenteser brukes til å ta komplementet til spesifiserte tegn. For eksempel [^abc] Angir det unntatt A, B eller C Enhver karakter til stede vil bli matchet.
$ (Dollar Symbol)	De $ symbolet brukes uansett hvor vi vil sjekke om en streng ender med en viss karakter eller ikke. For eksempel, A $ betyr at uansett hvilken streng vi samsvarer med, skal ha en på slutten, det vil si amnesi vil bli matchet med A $ Imidlertid vil hjertet ikke.
* (Star Symbol)	Stjernesymbolet stemmer over. For eksempel, Mann betyr at søk m og et tegn i en streng. Derfor mn vil ha 1 kamp. Hoved vil ikke ha noen kamp som en ikke blir fulgt av n Og det er det Jeg imellom.
+ (pluss symbol)	Pluss -symbolet er akkurat som et stjernesymbol med unntak av at det samsvarer med 1 eller flere forekomster av det spesifiserte mønsteret eller karakteren. For eksempel når mn streng blir søkt etter uttrykket ma+n Det er imidlertid ingen kamp når uttrykket blir søkt etter mennesket, det er en kamp.
(Seler)	For å ha en klar forståelse av seler, la oss først se følgende kode I-E 2,3 som betyr minst 2 og høyst 3 repetisjoner er mulig av mønsteret som er igjen fra det. For eksempel uttrykket A 2,3 Når du matchet med strengen “ABC Dat” vil imidlertid ikke ha kamp når uttrykket samsvarer med “ABC Daat” det vil ha en kamp i-e Daat.
| (Forandring)	Endringen eller vertikal stangsymbol brukes for OR -operatøren. For eksempel indikerer uttrykket A | B det en eller b skal være til stede i en spesifisert streng. Derfor fgh har ingen kamper og ABC har 2 kamper som er AB.
\ (Backslash)	Hensikten med tilbakeslag er å unnslippe karakterer og unnslippe alle metakarakterere. Med enkle ord, hvis du er usikker. Derfor vil den karakteren ikke bli behandlet på noen spesiell måte, for eksempel, \ $ a uttrykk vil samsvare med hvilken som helst tekst eller streng som har en $ etterfulgt av en.

Nå som vi vet hvordan vi skal spesifisere mønstre ved å bruke regex, la oss nå gå gjennom noen regex -metoder for å matche en regex med en spesifisert streng.

Testmønstre for matching

Tidligere diskuterte vi hvordan vi kan bruke REGEXP -konstruktøren til å initialisere REGEXP -objektet med et spesifisert mønster. Dette regexp-objektet gir oss mange innebygde metoder, og en av dem er test() metode. De test() Metoden er veldig nyttig ettersom den sjekker en streng for et spesifisert mønster i det vanlige uttrykket. De test() Metoden returnerer en boolsk verdi, det vil si hvis det spesifiserte mønsteret samsvarer med strengen, blir ekte returnert, ellers blir falsk returnert. Å bedre forstå test() Metode La oss se et eksempel:

var myRegex = /hallo /;
var output = myRegex.Test ('Hei verden!');
konsoll.logg (utgang); // sant

I koden ovenfor først definerte vi et mønster som er Hallo og brukte deretter den innebygde metodetesten () på det spesifiserte mønsteret for å sjekke om strengen Hei Verden! inneholder hei eller ikke. Resultatet er gitt nedenfor:

I stedet for den boolske verdien, kan strengkampen også returneres med en annen innebygd metode som er match () -metoden. Koden nedenfor implementerer Match () -metoden:

var myString = "Hello World!";
// mønster
var myRegex = /hallo /;
konsoll.Logg (MyString.Match (MyRegex)); // Hallo

En matrise vil bli returnert som vil inneholde inngangsstrengen til match () -metoden, indeksen som kampen er funnet i tillegg til selve kampen.

Hvis en kamp ikke blir funnet da null vil bli returnert:

var myString = "Hello World!";
// mønster
var myRegex = /hei /;
konsoll.Logg (MyString.Match (MyRegex)); // null

Mønsterflagg

Vi så at regexp -objektet godtar et mønster; Det skal imidlertid også bemerkes at REGEXP også kan ta en valgfri flaggparameter. Flagg er bare litt ekstra topping som endrer søkeatferden.

Det første flagget vi vil diskutere er Ignorer flagg betegnet med i. Som standard er mønstersøk i regex case sensitive, så å ignorere tilfeller bruker vi ignoreringsflagget (i) når vi søker etter et mønster. For eksempel:

var myRegex = /hallo /i;
konsoll.Logg (MyRegex.Test ("Hei verden!"); // sant

Selv om mønsteret har Hallo Og strengen i testmetoden har den første bokstavkapitalen, det er fremdeles en kamp fordi vi brukte Ignore Flag (i), og derfor vil resultatet være sant:

For å bruke Ignore Flag med REGEXP -objektkopi Kopier følgende kode:

var myRegex = new regexp ('hallo', 'i');
konsoll.Logg (MyRegex.Test ("Hei verden!"); // sant

Tilsvarende kan vi bruke Globalt flagg betegnet med g hvis funksjon er å returnere alle kampene i strengen. Uten det globale flagget er bare den første kampen returnert. Nedenfor koden bruker det globale flagget:

var myString = 'Hello World! Og hei univers!';
var myRegex = /hallo /gi;
var matches = [];
var kamp;
Gjør
Match = MyRegex.exec (myString);
if (match)
fyrstikker.push (match);

mens (kamp != null)
konsoll.logg (matcher);

Først initialiserte vi MyString som inneholder strengen som skal brukes til å søke i et mønster, og etter det opprettet vi et vanlig uttrykksmønster som inneholder det globale flagget og ignorerer flagget. Det globale flagget vil søke etter alle kampene, mens ignorering av flagget vil ignorere saksfølsomhet. I koden ovenfor brukes en annen innebygd metode som er Exec () hvis funksjon er å returnere en matrise som inneholder kampen. Imidlertid, hvis det ikke var noen kamp mellom mønsteret og strengen, vil null bli returnert. Det skal bemerkes at Exec () -metoden bare returnerer en enkelt kamp på en gang, og derfor bruker vi do-mens Loop og skyver alle kampene til matches-matrisen. Til slutt trøser vi matches -matrisen som inneholder alle kampene:

Konklusjon

Regex er en streng som definerer et mønster eller finner et mønster i en spesifisert streng. Vi bruker regexp-objektet eller fremover-slash / for å definere regex. REGEXP tar også et valgfritt parameter I-E-flagg som endrer søkeatferden. For å spesifisere mønstre bruker vi metakaraktører som er noen spesifikke tegn som har spesielle betydninger. For å teste om det stemmer overens med en streng eller ikke bruker vi innebygde metoder som test (), match () eller exec ().

I dette innlegget definerte vi først hva som er Regex i JavaScript og hva som er regex -syntaks i JavaScript. Så viste vi deg hvordan du spesifiserer mønstre ved hjelp av regex og testmønstre i JavaScript. Til slutt diskuterte vi de to flaggene som er globale og ignorerer flagg.