`RegExp`-objekt

Den här artikeln förklarar RegExp-objektet.

Vi kommer att förklara RegExp-objektet med praktiska exempel.

YouTube Video

RegExp-objekt

Vad är RegExp?

RegExp (reguljärt uttryck) är ett objekt som används för att representera strängmönster. Till skillnad från enkla teckenjämförelser kan du flexibelt definiera 'strängar som uppfyller vissa villkor.'.

Genom att använda ett RegExp-objekt kan du utföra operationer som sökning, validering, extrahering och ersättning av strängar på ett koncist och tydligt sätt. Det är mycket effektivt för vardagliga uppgifter som validering av formulärinmatning, logganalys och textformatering. Nedan följer några enkla exempel på reguljära uttryck.

1const pattern = /abc/;
  • Detta reguljära uttryck kontrollerar om sekvensen 'abc' finns med.

Hur man skapar reguljära uttryck (två metoder)

Det finns två typer av RegExp-syntax: literal notation och constructor notation.

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+");
  • Litteralnotation är kortfattad och lättläst, vilket gör den lämplig för reguljära uttryck som används som konstanter.. Å andra sidan används konstruktornotation när du vill bygga mönstret med hjälp av variabler eller bestämma dess innehåll vid körning.
  • Med litteralnotation kan du intuitivt beskriva både det reguljära uttrycket och dess flaggor tillsammans. I kontrast måste du med konstruktornotation ange mönstret och flaggorna separat.
  • Dessutom, med konstruktornotation, skickar du det reguljära uttrycket som en sträng, så bakåtsnedstreck måste avmaskas två gånger.

test(): Den mest grundläggande valideringen

RegExp-objektet tillhandahåller metoder för att utföra utvärderingar och operationer med reguljära uttryck. test() är en metod som returnerar en boolean som indikerar om ett mönster matchar.

1const regex = /JavaScript/;
2
3console.log(regex.test("I love JavaScript")); // true
4console.log(regex.test("I love TypeScript")); // false
  • Det är den första metoden du bör lära dig, och den är idealisk för villkorsstyrda grenar eller inmatningsvalidering.

match(): Hämta matchande resultat

match() returnerar en array som innehåller den matchande strängen och detaljerad information.

1const text = "Version 1.2.3";
2const result = text.match(/\d+\.\d+\.\d+/);
3
4console.log(result[0]); // "1.2.3"
  • match() är mer praktisk än test() för extrahering och tolkning.

replace(): Ersätta med hjälp av reguljära uttryck

replace() omvandlar den matchande delen till en annan sträng.

1const text = "Hello   World";
2const result = text.replace(/\s+/g, " ");
3
4console.log(result); // "Hello World"
  • Du kan använda det för loggformatering eller för att normalisera onödiga mellanslag.

Flaggor - grunder (g, i, m)

Du kan ange 'flaggor' i reguljära uttryck. Flaggor är alternativ som styr hur ett reguljärt uttryck behandlar strängar enligt vissa regler. Även med samma mönster kan resultaten förändras beroende på vilka flaggor som används.

1const text = "apple Apple APPLE";
2const regex = /apple/gi;        // or new RegExp("apple", "gi");
3
4console.log(text.match(regex)); // ["apple", "Apple", "APPLE"]
  • g-flaggan (global) söker genom hela strängen.
  • i-flaggan (case-insensitive) ignorerar skillnader mellan versaler och gemener vid matchning.
1const multilineText = `apple
2banana
3apple`;
4
5const regexM = /^apple/gm;
6
7console.log(multilineText.match(regexM)); // ["apple", "apple"]
  • m-flaggan (multirad) används för att behandla flerradiga strängar rad för rad. Med detta fungerar ^ och $ utifrån början eller slutet på varje rad, snarare än på hela strängen.

Teckenklasser: Kombinera flera kandidater

Genom att använda hakparenteser [] kan du definiera en uppsättning möjliga tecken för en enda position.

1const regex = /gr[ae]y/;
2
3console.log(regex.test("gray")); // true
4console.log(regex.test("grey")); // true
  • Detta är användbart för att hantera stavningsvariationer och enkla alternativ.

Metatecken: Vanliga genvägar

Metatecken är symboler som gör att du kan skriva vanliga mönster i en kortare form.

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 betyder en siffra, och {n} anger antalet upprepningar.

^ och $: Validera hela strängen

^ och $ representerar början och slutet av en sträng.

1const regex = /^\d+$/;
2
3console.log(regex.test("123"));   // true
4console.log(regex.test("123a"));  // false
  • De är viktiga i situationer där en exakt matchning krävs, såsom vid formulärinmatning.

Gruppering och fångst

Genom att använda parenteser () kan du extrahera delvärden.

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 används ofta för att dela upp datum och strukturerade strängar.

Vanliga misstag och saker att tänka på

Reguljära uttryck är kraftfulla, men de tenderar att bli svårlästa.

1// Hard to read
2const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+$/;
  • Om det blir för komplext kan du överväga att lägga till kommentarer, dela upp uttryck eller se över själva processen.

Sammanfattning

RegExp är en väsentlig grundfunktion i JavaScript för att beskriva strängbehandling på ett enkelt och korrekt sätt. Du behöver inte lära dig komplexa reguljära uttryck från början; det är viktigt att använda grundläggande metoder och syntax som test, match och replace utifrån dina praktiska behov. Om du kan se reguljära uttryck inte som 'speciell kunskap' utan som 'verktyg för organiserad mönsterrepresentation', kommer du avsevärt att förbättra kvaliteten och läsbarheten på inmatningsvalidering och textbehandling.

Du kan följa med i artikeln ovan med hjälp av Visual Studio Code på vår YouTube-kanal. Vänligen kolla även in YouTube-kanalen.

YouTube Video