Javascript: reguliere expressies

  1. Basisbegrippen
  2. Werken met reguliere expressies
  3. Argumenten
  4. Tekens en symbolen

Basisbegrippen

Een reguliere expressie vormt een patroon dat je kan gebruiken om tekenreeksten te doorzoeken.
Met reguliere expressies kan je antwoorden krijgen op vragen zoals:

Dit kan je handig toepassen bij bijvoorbeeld de controle van formuliergegevens.

Om een reguliere expressie te definiëren declareer je een variabele en plaats je de uitdrukking tussen twee slashes.
Je kan ook de constructor van een RegExp gebruiken, nu geef je de expressie als String mee. Het voordeel aan deze werkwijze is dat het patroon variabel kan worden ingesteld, en zoekwoorden dus bijvoorbeeld aan de gebruiker kunnen worden gevraagd. Hierbij zal je voor complexere uitdrukkingen vaak rekening moeten houden met het escapeteken (\).

var patroon = /RexExp/;
of:
var patroon = new RegExp("RexExpString");

Werken met reguliere expressies

De methode test van een Reguliere Expressie

De methode test van een Reguliere Expressie retourneert true als de expressie voorkomt in de meegegeven tekenreeks.

var patroon = /javascript/;
var tekst = "Reguliere expressies met javascript";
if(patroon.test(tekst)) document.write("Het patroon werd gevonden");

String-methoden met reguliere expressies

De krachtigste methoden voor het werken met reguliere expressies zijn echter methoden die op de tekenreeks worden toegepast.

Methode Omschrijving
search(regex) Retourneert de positie waar de expressie het eerst voorkomt in de tekenreeks. Komt de expressie niet voor, dan retourneert search -1
replace(regex,string) Vervangt het tekstdeel dat beantwoord aan regex door een tekenreeks
split(regex) Splitst een tekenreeks op basis van regex in een Array
var patroon = /javascript/;
var tekst = "Werken met reguliere expressies in javascript";
document.write("Zin: <b>" +tekst +"</b><br>");
document.write("Expressie gevonden op positie: <b>" +tekst.search(patroon) +"</b><br>");
document.write("Nieuwe zin: <b>" +tekst.replace(patroon,"Java-Script") +"</b>");

var talen = "javascript,C#,Java,HTML,CSS,Cobol,Fortran";
var arrTalen = talen.split(/,/);
document.write("<h5><u>Talen</u></h5>");
for(i=0;i<arrTalen.length;i++){
	document.write(arrTalen[i] +"<br>");
}

Argumenten

Je kan de volgende argumenten gebruiken om de zoekopdracht uit te voeren:

Argument Omschrijving
i case-insensitive: de zoekopdracht is niet hoofdlettergevoelig
g global: de volledige tekenreeks wordt doorzocht - bij een replace wordt niet enkel de eerste instantie vervangen
var zin = "Werken met Javascript - JAvAscript is leuk";

document.write("Originele zin: <b>" +zin +"</b><br>");

var patroon = /java/;
document.write("Zonder argumenten: <b>" +zin.replace(patroon,"JAVA") +"</b><br>");

var patroon = /java/i;
document.write("Argument i: <b>" +zin.replace(patroon,"JAVA") +"</b><br>");

var patroon = /java/ig;
document.write("Argument i en g: <b>" +zin.replace(patroon,"JAVA") +"</b><br>");

var patroon = new RegExp("java","ig");
document.write("RegExp-constructor i en g: <b>" +zin.replace(patroon,"JAVA") +"</b><br>");

Tekens en symbolen

Om een patroon op te stellen zijn er heel wat geavanceerde mogelijkheden:

Teken Beschrijving Voorbeeld
Normaal teken Het opgegeven teken zelf wordt gezocht java: er wordt gezocht naar het woord java met de tekens exact in deze volgorde
[...] Een van de tekens moet worden gevonden [jJ]ava: java met een kleine of grote J zal worden gevonden. (de rest moet in kleine letters geschreven zijn)
[^...] Een teken dat niet tussen de haakjes voorkomt [^aA]001: 001 voorafgegaan door een teken dat niet a of A is.
[A-Z] Een teken van A tot Z [B-F]111: 111 voorafgegaan door een letter B-F.
(...) Een bereik waarmee je tekens groepeert  
? Het voorafgaande teken of bereik is optioneel varkens?: het woord varken of varkens - de s is optioneel
java(script)?: java of javascript - script is optioneel
+ Het voorafgaande teken of bereik moet een of meerdere keren voorkomen  
* Het voorafgaande teken of bereik kan een willekeurig aantal keren of helemaal niet voorkomen  
{n,m} Het voorafgaande teken of bereik moet n keer (en hoogstens m keer gevonden worden - optioneel)  
| Onderscheid tussen verschillende mogelijkheden html|css|javascript: html of css of javascript
^ Caret: het begin van de tekenreeks ^Een: het woord Een aan het begin van de tekenreeks
$ Dollar: het einde van de tekenreeks a$: de letter a op het einde van de tekenreeks
^[a-z]{4}$: exact 4 kleine letters
\ Backslash: escape-teken om speciale karakters te vormen \\: een backslash
\/: een slash
\w: een word karakter: [a-zA-Z0-9_]
\W: geen word karakter: [^a-zA-Z0-9_]
\d: digit - een cijfer [0-9]
\D: geen cijfer [^0-9]
\n: regelterugloop
\t: tabsprong
\b: woordgrens - \bjava\b: zoeken naar het woord java, javascript wordt niet gevonden.
\B: geen woordgrens

Meer bij: webreference, Regular-expressions.info.

Meer tutorials:
leer ook: html | xhtml | css | asp | asp.net | c# | ado.net | linq | ajax | java | javascript
Valid HTML 4.01! Valid CSS! © - Cursusweb