Grupper, fångster och Replace
Fånga delar av text med grupper, använd namngivna grupper, iterera över alla träffar och gör säkra ersättningar med bakreferenser eller en funktion.
Grupper, fångster och Replace är en gratis lektion i JavaScript Academy på CoddyKit. Detta är lektion 2 av 3. Du kan läsa vilka 3 lektioner som helst i den här lärvägen kostnadsfritt i sin helhet – därefter låser CoddyKit PRO upp alla lektioner, plus praktisk övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Den ingår i lärvägen för JavaScript Academy, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i JavaScript Academy innehåller totalt 3 lektioner.
Varför grupper?
Mål: Extrahera och omforma text.
- Fångstgrupper: (...)
- Namngivna grupper: (?<name>...)
- matchAll för att gå igenom alla resultat
- replace med $1 eller en funktion
Numrerade grupper
Använd (...) för att fånga delar. Åtkom dem via index: m[1], m[2], ...
// Capture YYYY-MM-DD into groups
const r = /(\\d{4})-(\\d{2})-(\\d{2})/;
const m = r.exec("Today: 2025-09-26");
if (m) {
console.log("year:", m[1], "month:", m[2], "day:", m[3]);
} else {
console.log("no match");
}
Namngivna grupper
Namngivna grupper ger läsbara nycklar via m.groups.name.
// Named groups make code clearer
const rx = /(?<y>\\d{4})-(?<m>\\d{2})-(?<d>\\d{2})/;
const hit = rx.exec("Release 2024-01-05");
if (hit) {
console.log("y:", hit.groups.y, "m:", hit.groups.m, "d:", hit.groups.d);
}
Gå igenom matchningar
matchAll returnerar en iterator. Använd den med g för att gå igenom varje matchning och läsa grupperna.
// matchAll with the g flag to get every match and groups
const text = "IDs: A-12, B-7, C-300";
const pattern = /([A-Z])-(\\d+)/g;
for (const match of text.matchAll(pattern)) {
console.log("letter:", match[1], "num:", match[2]);
}
Ersätt med grupper
replace kan använda $1, $2 eller en callback för att bygga den nya texten.
// Replace order: "2025-09-26" -> "26/09/2025"
const date = "2025-09-26";
// With backreferences
const swapped1 = date.replace(/(\\d{4})-(\\d{2})-(\\d{2})/, "$3/$2/$1");
console.log("swap1:", swapped1);
// With a function for more control
const swapped2 = date.replace(/(?<y>\\d{4})-(?<m>\\d{2})-(?<d>\\d{2})/, function (_all, _y, _m, _d, groups) {
return groups.d + "/" + groups.m + "/" + groups.y;
});
console.log("swap2:", swapped2);
Tips och fallgropar
Tips:
- Lägg till g när alla matchningar behövs (använd matchAll).
- Föredra namngivna grupper för tydlighetens skull.
- Håll mönstren små och testa på korta exempelsträngar.
Quiz om matchAll-grunder
Snabb kontroll: Gå igenom alla matchningar med grupper.
Sammanfattning
Sammanfattning: Fånga med (...), använd namngivna grupper för tydlighet, gå igenom alla matchningar via matchAll och omforma text med replace och bakåtreferenser eller en callback.
Lär dig JavaScript med en AI-lärare – gratis
Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.
- Kurser
- 59
- Lektioner
- 200
Vanliga frågor
Är lektionen ”Grupper, fångster och Replace” gratis?
Ja – du kan läsa vilka 3 lektioner som helst i lärvägen JavaScript Academy, inklusive ”Grupper, fångster och Replace”, kostnadsfritt i sin helhet här på webben. Därefter låser CoddyKit PRO upp alla lektioner, plus interaktiv övning med en inbyggd kodredigerare och en AI-lärare dygnet runt. Kursen i JavaScript Academy innehåller totalt 3 lektioner.
Vad lär jag mig i ”Grupper, fångster och Replace”?
Fånga delar av text med grupper, använd namngivna grupper, iterera över alla träffar och gör säkra ersättningar med bakreferenser eller en funktion. Ni övar på JavaScript Academy med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.
Behöver jag någon erfarenhet för att börja lära mig JavaScript Academy?
Du behöver inga förkunskaper. Utbildningen i JavaScript Academy på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 2 av 3.
Hur lång tid tar lektionen ”Grupper, fångster och Replace”?
De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.
Kan jag skriva och köra kod i den här JavaScript Academy-lektionen?
Ja. Varje JavaScript Academy-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.
Alla lektioner i den här kursen
- Grunderna i regex — literaler, test, ankare och flaggor
- Grupper, fångster och Replace
- Validering och vanliga fallgropar