W3docs

JavaScript Regex Wortgrenze (\b)

In JavaScript-regulären Ausdrücken wird der \b-Anker verwendet, um Wortgrenzen zu erkennen. Eine Wortgrenze ist eine Position zwischen einem Wortzeichen (\w) und einem Nicht-Wortzeichen.

Einführung in Wortgrenzen

In JavaScript regulären Ausdrücken wird der \b-Anker verwendet, um Wortgrenzen zu erkennen. Eine Wortgrenze ist eine Position zwischen einem Wortzeichen (definiert durch die \w-Zeichenklasse, die [a-zA-Z0-9_] umfasst) und einem Nicht-Wortzeichen (alles, was kein Wortzeichen ist). Dies ermöglicht das präzise Erkennen ganzer Wörter und ist besonders nützlich für Aufgaben wie Suchen, Ersetzen oder Validieren bestimmter Wortmuster in Texten.

\b ist einer der Regex-Anker. Anders als die Anker für den Anfang und das Ende einer Zeichenkette ^ und $, die eine Übereinstimmung auf die Ränder der Eingabe beschränken, begrenzt \b sie auf die Ränder eines Wortes — ein einziges Muster kann so ganze Wörter an beliebiger Stelle in einer Zeichenkette finden.

Dieses Kapitel behandelt, was als Wortgrenze gilt, wie der entgegengesetzte \B-Anker funktioniert, die nullbreite Natur beider Anker, gängige Muster zur Erkennung ganzer Wörter sowie die Einschränkungen bei Unicode-Text.

Verwendung des \b-Ankers

Der \b-Anker ist eine nullbreite Aussage: Er erkennt eine Position, kein Zeichen. Die Position muss zwischen einem Wortzeichen (eines, das \w erkennt: [a-zA-Z0-9_]) und einem Nicht-Wortzeichen liegen — oder zwischen einem Wortzeichen und dem absoluten Anfang oder Ende der Zeichenkette. Da er nullbreit ist, verbraucht \b nichts; er schränkt nur ein, wo der Rest des Musters übereinstimmen darf.

Es gibt drei Stellen, an denen eine Wortgrenze auftritt:

  • Vor dem ersten Zeichen, wenn dieses Zeichen ein Wortzeichen ist.
  • Nach dem letzten Zeichen, wenn dieses Zeichen ein Wortzeichen ist.
  • Zwischen zwei benachbarten Zeichen, von denen genau eines ein Wortzeichen ist.

Der ergänzende Anker \B erkennt jede Position, die keine Wortgrenze ist.

Um zu sehen, wo die Grenzen tatsächlich liegen, wird an jeder \b-Position eine Markierung eingefügt:

javascript— editable

Erläuterung: Die vier Grenzen sind: vor a, nach c (neben dem Leerzeichen), vor d und nach f (Ende der Zeichenkette). Der Leerzeichen-zu-Leerzeichen-Übergang hat keine Grenze, da keine Seite ein Wortzeichen ist.

Beispiel: Erkennung ganzer Wörter

javascript— editable

Erläuterung:

  • Der Regex /\bcat\b/ erkennt das Wort "cat" als ganzes Wort.
  • In der Zeichenkette 'The cat is here.' ist "cat" ein eigenständiges Wort, daher ist die Übereinstimmung true.
  • In der Zeichenkette 'The caterpillar is here.' ist "cat" Teil des Wortes "caterpillar", daher ist die Übereinstimmung false.

Beispiel: Ganze Wörter im Text suchen

javascript— editable

Erläuterung:

  • Der Regex /\bcat\b/g findet alle Vorkommen von "cat" als ganzes Wort im Text.
  • Er erkennt nur "cat", nicht "scatter", "caterpillar" oder "catfish", da "cat" in diesen Kontexten kein eigenständiges Wort ist.
  • Das Ergebnis ist ein array mit ["cat"].

Nicht-Wortgrenzen (\B)

\B ist das genaue Gegenteil von \b: Es erkennt jede Position, die keine Wortgrenze ist. Das bedeutet, es trifft in der Mitte eines Wortes zu (zwischen zwei Wortzeichen) oder zwischen zwei Nicht-Wortzeichen, und schlägt fehl, wo \b erfolgreich wäre.

Verwende \B, wenn du ein Muster nur dann erkennen möchtest, wenn es eingebettet in einem größeren Wort vorkommt.

javascript— editable

Erläuterung:

  • /\Boo\B/g erfordert eine Nicht-Grenze auf beiden Seiten von oo.
  • In 'noon' hat das oo auf beiden Seiten n, sodass beide \B-Aussagen zutreffen — es wird erkannt.
  • In 'zoo' befindet sich oo am Ende des Wortes, sodass dort eine echte Wortgrenze existiert und \B scheitert. Nur das oo aus 'noon' wird zurückgegeben.

Eine praktische Merkhilfe für die Beziehung: An jeder Position trifft genau eine von \b und \B zu.

Praktische Anwendungen

Validierung von Eingabefeldern

Wortgrenzen können nützlich sein, um Eingabefelder zu validieren, in denen exakte Wortübereinstimmungen erforderlich sind.

javascript— editable

Erläuterung:

  • Der Regex /^\w+$/ stellt sicher, dass die Eingabe ein einzelnes Wort ohne Leerzeichen ist.
  • ^ markiert den Anfang der Zeichenkette und $ das Ende. Da \w nur Wortzeichen erkennt, erzwingen ^ und $ implizit Wortgrenzen, wodurch \b hier überflüssig ist.
  • \w+ erkennt ein oder mehrere Wortzeichen (einschließlich Buchstaben, Ziffern und Unterstriche).
  • 'user123' stimmt überein, da es sich um ein einzelnes Wort ohne Leerzeichen handelt.
  • 'user 123' stimmt nicht überein, da es ein Leerzeichen enthält, das die Folge der Wortzeichen unterbricht.
  • Beachte, dass \w Unterstriche enthält, was die Validierungslogik beeinflussen kann, wenn du diese ausschließen möchtest.

Wörter aus einem Satz extrahieren

Du kannst mithilfe von Wortgrenzen bestimmte Wörter aus einem Satz extrahieren.

javascript— editable

Erläuterung:

  • Das Regex-Muster /\btest\w*\b/gi erkennt alle Wörter, die mit "test" beginnen.
  • Das g-Flag stellt sicher, dass alle Übereinstimmungen in der Zeichenkette zurückgegeben werden.
  • Das i-Flag sorgt dafür, dass die Übereinstimmung ohne Berücksichtigung der Groß-/Kleinschreibung erfolgt, sodass sowohl "test" als auch "Testing" erkannt werden.
  • Das Ergebnis ist ["test", "Testing"], da beide Wörter mit "test" beginnen und von null oder mehr Wortzeichen gefolgt werden.

Kombination von Wortgrenzen mit anderen Mustern

Wortgrenzen können mit anderen Regex-Mustern für komplexere Übereinstimmungen kombiniert werden.

Beispiel: Wörter mit Präfix suchen

javascript— editable

Erläuterung:

  • Der Regex /\bpre\w*\b/g erkennt Wörter, die mit dem Präfix "pre" beginnen.
  • \bpre markiert eine Wortgrenze gefolgt von "pre".
  • \w* erkennt null oder mehr Wortzeichen.
  • \b markiert eine Wortgrenze am Ende.
  • Das Ergebnis ist ein array mit ["preheat", "prefix", "prepare", "pressure"].

Beispiel: Wörter mit bestimmtem Suffix suchen

javascript— editable

Erläuterung:

  • Der Regex /\w+ing\b/g erkennt Wörter, die auf "ing" enden.
  • \w+ erkennt ein oder mehrere Wortzeichen.
  • ing\b erkennt "ing" gefolgt von einer Wortgrenze.
  • Das Ergebnis ist ein array mit ["running", "walking", "talking", "thinking"].
Info

Wenn du ganze Wörter erkennen oder sicherstellen möchtest, dass Wörter nicht Teil größerer Zeichenketten sind, verwende den \b-Anker, um Wortgrenzen präzise zu definieren

\b für präzise Worterkennung verwenden

javascript— editable

Erläuterung:

  • Der Regex /\bdog\b/g erkennt das Wort "dog" als ganzes Wort.
  • Er erkennt nicht "dogs", da "dog" in diesem Kontext kein eigenständiges Wort ist.
  • Das Ergebnis ist ein array mit ["dog"].

Beispiel: Erkennung ganzer Zahlen

Da Ziffern Wortzeichen sind, funktioniert \b auch bei Zahlen — nützlich, um ganze Zahlen aus gemischtem Text zu extrahieren, ohne an einem Dezimalpunkt zu trennen.

javascript— editable

Erläuterung:

  • /\b\d+\b/g erkennt Ziffernfolgen, die zwischen Nicht-Ziffern-Zeichen eigenständig stehen.
  • 3.14 wird in "3" und "14" aufgeteilt, da . ein Nicht-Wortzeichen ist und sich auf jeder Seite eine Wortgrenze befindet.

Einschränkungen bei Unicode

Der \b-Anker ist ausschließlich auf Basis des ASCII-\w-Zeichensatzes ([a-zA-Z0-9_]) definiert. Buchstaben mit diakritischen Zeichen oder Zeichen aus nicht-lateinischen Schriften werden als Nicht-Wortzeichen behandelt, sodass an unerwarteten Stellen Grenzen auftreten.

javascript— editable

Erläuterung:

  • é ist nicht in \w enthalten, daher sieht die Engine eine Wortgrenze zwischen caf und é.
  • Das abschließende \b nach é erwartet, dass é ein Wortzeichen ist — das ist es nicht — sodass die gesamte Aussage scheitert, obwohl der Text eindeutig das Wort "café" enthält.

JavaScript stellt keine Unicode-fähige Version von \b bereit (die Flags u und v ändern seine Definition nicht). Wenn du Wörter mit Akzenten oder nicht-lateinischen Zeichen als ganze Wörter erkennen musst, erstelle deine eigenen Grenzen aus einer expliziten Zeichenklasse, zum Beispiel:

javascript— editable

Erläuterung:

  • \p{L} (aktiviert durch das u-Flag) erkennt jeden Unicode-Buchstaben.
  • Der Lookbehind (?<![\p{L}]) und Lookahead (?![\p{L}]) bilden eine buchstabengerechte Grenze nach, sodass café erkannt wird, cafés hingegen nicht.
  • Dies ist die Standardlösung, wenn ASCII-\b für dein Alphabet zu eingeschränkt ist.

Fazit

Der \b-Anker in JavaScript-regulären Ausdrücken ist ein leistungsstarkes Werkzeug zur Erkennung von Wortgrenzen. Mit diesem Anker kannst du präzise und effektive Muster zum Suchen, Ersetzen und Validieren von Wörtern in Texten erstellen. Ob du an Suchfunktionen, Datenvalidierung oder Textverarbeitung arbeitest — das Verstehen und Nutzen von Wortgrenzen kann deine Regex-Fähigkeiten erheblich verbessern.

Übungen

Übung
Wozu dient die Wortgrenze '\b' in JavaScript?
Wozu dient die Wortgrenze '\b' in JavaScript?
Was this page helpful?