Regulärer Chatbot

Reguläre Ausdrücke in JavaScript

Ein Regulärer Ausdruck (oder Regex) ist eine Folge von Zeichen, mit der wir bestimmte Elemente in Strings ansprechen und bearbeiten können. Damit können wir:

• nach einem Text in einem String suchen
• Teilstrings in einem String ersetzen
• Informationen aus einem String extrahieren

💡 JavaScripts Regex-Variante ist Teil des ECMA-262-Standards für die Sprache. Das bedeutet, dass du dir keine Gedanken über browserspezifische Kompatibilität machen musst.

Wie du reguläre Ausdrücke erstellst

In JavaScript schreibt man einen regulären Ausdruck meist im Format /pattern/modifiers.

Es gibt zwei Möglichkeiten, einen regulären Ausdruck zu erstellen:

1. Literal für reguläre Ausdrücke:

const regex = /[a-z]/;

1. Konstruktor RegExp:

const regex = new RegExp('[a-z]');

In beiden Fällen erstellt JavaScript aus dem Regex ein Objekt. Am besten verwendest du unveränderliche Muster und nutzt standardmäßig das Literal.

Den RegExp-Konstruktor kannst du für Fälle verwenden, in denen sich der reguläre Ausdruck ändert oder du ihn noch nicht kennst (etwa bei einer Eingabe).

🏴‍☠️ Flags

Reguläre Ausdrücke haben optionale Superkräfte namens flags, die zusätzliche Funktionen ermöglichen.

Einige der am häufigsten verwendeten sind:

• /g - Globale Suche
• /i - Groß-/Kleinschreibung ignorieren
• /m - Mehrzeilige Suche

Hier ein einfaches Beispiel:

const re = /home/gi;
const str = 'Home, sweet home.';
const myArray = str.match(re);
console.log(myArray);

=> // ["Home", "home"]

Das Zeichen g ermöglicht es uns, alle möglichen Treffer in einem String zu finden. Ohne diese Funktion hätte JavaScript nur den ersten Treffer Home extrahiert.

Das Flag /i für Groß-/Kleinschreibung ignorieren macht uns beim Finden eines Musters flexibel. So spielt es keine Rolle, ob das Gesuchte in UPPERCASE oder lowercase geschrieben ist.

Wenn du den RegExp-Konstruktor verwendest, ist die Syntax zum Hinzufügen von Flags anders.

let regex = /[a-z]/gi; // literal notation
let regex = new RegExp('[a-z]', 'gi'); // constructor with string pattern as first argument
let regex = new RegExp(/[a-z]/, 'gi'); // constructor with regular expression literal as first argument (Starting with ECMAScript 6)

Die gängigsten Funktionen

Kombinierst du reguläre Ausdrücke mit den eingebauten Funktionen von JavaScript, hast du einige mächtige Möglichkeiten, Strings zu bearbeiten und Daten daraus zu gewinnen.

Das sind einige der häufigsten Funktionen, die zusammen mit Regex verwendet werden.

Test

Die Methode test() sucht nach einer Übereinstimmung zwischen einem regulären Ausdruck und einem angegebenen String. Sie gibt wahr oder falsch zurück.

const str = 'It is difficult to test if you have a virus';
const result = /virus$/.test(str);

console.log(result);

// => true

Match

Mit der Methode match() erhalten wir ein nützliches Array, dessen Inhalt davon abhängt, ob Treffer gefunden wurden oder nicht.

So können wir aus jedem String Informationen sowohl suchen als auch extrahieren. Zum Beispiel:

const funnyQuote =
  'If you see someone crying, ask if it is because of their haircut.';
const regex1 = /someone/;
const regex2 = /happy/;

funnyQuote.match(regex1);
// => ["someone", index: 11, input: "If you see someone crying, ask if it is because of their haircut.", groups: undefined]

funnyQuote.match(regex2);
// => null

Wenn das Flag /g für globale Suche gesetzt ist, gibt die Methode nicht nur den einen Treffer zusammen mit nützlichen Informationen wie dem Index oder der Eingabe zurück, sondern alle Vorkommen, die im Array angezeigt werden:

const funnyQuote =
  'If you see someone crying, ask if it is because of their haircut.';

const regex3 = /if/gi;

funnyQuote.match(regex3);
// => ["If", "if"];

Replace

Die Methode replace() in JavaScript ermöglicht es uns, in einem gegebenen String nach einem Wert zu suchen und ihn durch einen gewünschten neuen Wert zu ersetzen.

string.replace(searchValue, newValue);

Das Suchmuster für die Ersetzung kann ein einzelner String oder ein regulärer Ausdruck sein.

let string = 'I like dogs!';
let result = string.replace('dogs', 'cats');

let string = 'I would love to travel to Japan';
let result = string.replace(/Japan/g, 'Hawaii');

Außerdem können wir an der Stelle des Ersatzes eine Funktion anwenden, um jeden Wert zusätzlich zu verändern.

let text = 'Say hello to the chatbot.';
let result = text.replace(/chatbot|hello/gi, function (word) {
  return word.toUpperCase();
});
// => "Say HELLO to the CHATBOT"

Split

Die Methode split() in JavaScript ist eine andere Art, Strings mit regulären Ausdrücken zu verwenden und zu bearbeiten.

Auf diese Weise verwenden wir Regex, um einen gegebenen String anhand eines erkannten Musters zu teilen, z. B. str.split(/[,.\s]/). Dieses Muster wird als separator verwendet.

const str = 'hello,user.how are.you';

const result = str.split(/[,.\s]/);

console.log(result);
// => ['hello', 'user', 'how', 'are', 'you']