`RegExp`-objektet

Denne artikkelen forklarer RegExp-objektet.

Vi vil forklare RegExp-objektet med praktiske eksempler.

YouTube Video

RegExp-objektet

Hva er RegExp?

RegExp (regulært uttrykk) er et objekt som brukes til å representere mønstre i strenger. I motsetning til enkle tegnsammenligninger kan du fleksibelt definere 'strenger som oppfyller visse betingelser.'.

Ved å bruke et RegExp-objekt kan du utføre operasjoner som søk, validering, uthenting og erstatning av strenger på en konsis og tydelig måte. Det er svært effektivt for daglige oppgaver som validering av skjemainndata, logganalyse og tekstformatering. Nedenfor finner du noen enkle eksempler på regulære uttrykk.

1const pattern = /abc/;

• Dette regulære uttrykket sjekker om sekvensen 'abc' er inkludert.

Hvordan lage regulære uttrykk (to metoder)

Det finnes to typer RegExp-syntaks: bokstavelig notasjon og konstruktør-notasjon.

1// Literal notation: pattern and flags are written together
2const literal         = /hello/;
3const literalWithFlag = /hello/i;
4const literalDigits   = /\d+/;
5
6// Constructor notation: pattern and flags are passed separately
7const constructor         = new RegExp("hello");
8const constructorWithFlag = new RegExp("hello", "i");
9const constructorDigits   = new RegExp("\\d+");

• Bokstavelig notasjon er kortfattet og lettlest, noe som gjør den godt egnet for regulære uttrykk brukt som konstanter.. På den andre siden brukes konstruktørnotasjon når du ønsker å bygge mønsteret ved hjelp av variabler eller bestemme innholdet ved kjøretid.
• Med bokstavelig notasjon kan du intuitivt beskrive både det regulære uttrykket og dets flagg sammen. I motsetning til dette må du med konstruktørnotasjon spesifisere mønster og flagg separat.
• I tillegg, med konstruktørnotasjon, overføres det regulære uttrykket som en streng, så omvendte skråstreker må skrives to ganger.

test(): Den mest grunnleggende valideringen

RegExp-objektet gir metoder for å utføre evalueringer og operasjoner ved bruk av regulære uttrykk. test() er en metode som returnerer en boolsk verdi som indikerer om et mønster samsvarer.

1const regex = /JavaScript/;
2
3console.log(regex.test("I love JavaScript")); // true
4console.log(regex.test("I love TypeScript")); // false

• Det er den første metoden du bør lære, og den er ideell for betinget forgrening eller validering av inndata.

match(): Få samsvarende resultater

match() returnerer et array som inneholder samsvarende streng og detaljert informasjon.

1const text = "Version 1.2.3";
2const result = text.match(/\d+\.\d+\.\d+/);
3
4console.log(result[0]); // "1.2.3"

• match() er mer praktisk enn test() for utvinnings- og analyseringsprosesser.

replace(): Erstatte ved bruk av regulære uttrykk

replace() konverterer den samsvarende delen til en annen streng.

1const text = "Hello   World";
2const result = text.replace(/\s+/g, " ");
3
4console.log(result); // "Hello World"

• Du kan bruke det for loggformatering eller for å normalisere unødvendig mellomrom.

Grunnleggende om flagg (g, i, m)

Du kan spesifisere 'flagg' i regulære uttrykk. Flagg er valg som kontrollerer hvordan et regulært uttrykk behandler strenger i henhold til bestemte regler. Selv med samme mønster kan resultatene endres avhengig av flaggene.

1const text = "apple Apple APPLE";
2const regex = /apple/gi;        // or new RegExp("apple", "gi");
3
4console.log(text.match(regex)); // ["apple", "Apple", "APPLE"]

• g-flagget (global) søker gjennom hele strengen.
• i-flagget (ignorér store/små bokstaver) ignorerer forskjeller mellom store og små bokstaver ved sammenligning.

1const multilineText = `apple
2banana
3apple`;
4
5const regexM = /^apple/gm;
6
7console.log(multilineText.match(regexM)); // ["apple", "apple"]

• m-flagget (multilinje) brukes for å behandle flerstrekete strenger linje for linje. Med dette opererer ^ og $ ut fra begynnelsen eller slutten på hver linje, i stedet for hele strengen.

Tegnklasser: Kombiner flere alternativer

Ved å bruke hakeparenteser [], kan du definere et sett med mulige tegn for en enkelt posisjon.

1const regex = /gr[ae]y/;
2
3console.log(regex.test("gray")); // true
4console.log(regex.test("grey")); // true

• Dette er nyttig for å håndtere stavevariasjoner og enkle alternativer.

Metategn: Vanlige snarveier

Metategn er symboler som lar deg skrive ofte brukte mønstre på en kortere måte.

1const regex = /\d{4}-\d{2}-\d{2}/;  // or new RegExp("\\d{4}-\\d{2}-\\d{2}");
2
3console.log(regex.test("2025-12-29")); // true

• \d betyr et siffer, og {n} angir antall repetisjoner.

^ og $: Valider hele strengen

^ og $ representerer starten og slutten på en streng.

1const regex = /^\d+$/;
2
3console.log(regex.test("123"));   // true
4console.log(regex.test("123a"));  // false

• De er viktige i situasjoner der et eksakt treff er påkrevd, for eksempel i skjema-innmatninger.

Gruppering og fangst

Ved å bruke parenteser (), kan du hente ut delverdier.

1const text = "2025/12/29";
2const regex = /(\d{4})\/(\d{2})\/(\d{2})/;
3const [, year, month, day] = text.match(regex);
4
5console.log(year, month, day); // 2025 12 29

• Det brukes ofte for å dele opp datoer og strukturerte strenger.

Vanlige feil og punkter å merke seg

Regulære uttrykk er kraftige, men de har en tendens til å bli vanskelige å lese.

1// Hard to read
2const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+$/;

• Hvis det blir for komplisert, kan du vurdere å legge til kommentarer, dele opp uttrykkene eller revidere selve prosessen.

Sammendrag

RegExp er en essensiell grunnleggende funksjon i JavaScript for å beskrive strengbehandling på en enkel og presis måte. Du trenger ikke å lære komplekse regulære uttrykk fra starten; det er viktig å bruke grunnleggende metoder og syntaks som test, match og replace etter dine praktiske behov. Hvis du kan behandle regulære uttrykk ikke som 'spesiell kunnskap', men som 'verktøy for organisert mønsterrepresentasjon', vil du forbedre kvaliteten og lesbarheten på inndata-validering og tekstbehandling betydelig.

Du kan følge med på artikkelen ovenfor ved å bruke Visual Studio Code på vår YouTube-kanal. Vennligst sjekk ut YouTube-kanalen.

YouTube Video