Zurück zur Startseite

RegExp.escape() escaped Buchstaben und Leerzeichen: warum

RegExp.escape() escaped lateinische Buchstaben, Ziffern und Leerzeichen für sichere RegExp-Konkatenation. Der Standard erfordert dies, um Fehler mit Capture Groups und Legacy-Sequenzen zu vermeiden. Empfohlen zur Verwendung mit u-Flag und Polyfill.

Warum versteckt RegExp.escape() Buchstaben in \x-Codes?
Advertisement 728x90

Escaping in RegExp.escape(): Warum Buchstaben, Ziffern und Leerzeichen zu \x-Codes werden

Die Funktion RegExp.escape(), die 2025 in Browsern eingeführt wurde, escaped nicht nur Regex-Metazeichen, sondern auch lateinische Buchstaben, führende Ziffern, Leerzeichen und Interpunktion wie @. Das unterscheidet sie von traditionellen manuell erstellten Escape-Funktionen, die solche Zeichen ignoriert haben. Der ECMAScript-Standard schreibt das vor, um Fehler bei der Verkettung von RegExps zu vermeiden.

Gründe für das Escapen von Ziffern und Buchstaben

Führende Ziffern werden escaped, um eine Fehlinterpretation als Gruppennummern oder Oktal-Codes zu verhindern. Lateinische Buchstaben sorgen für eine korrekte Handhabung von Escape-Sequenzen wie \c.

Beispiel mit einer Ziffer:

Google AdInline article slot
p = '2'
new RegExp('()\\1' + RegExp.escape(p)).source // ()\\1\\x32
new RegExp('()\\1' + p).source // ()\\12

Ohne Escaping bezieht sich \12 auf die 12. Gruppe oder das Zeichen mit dem Oktal-Code 12. Mit Escaping wird Gruppe 1 gefolgt vom Zeichen 2 abgebildet.

Beispiel mit einem Buchstaben:

p = 'a'
new RegExp('\\c' + RegExp.escape(p)).source // \\c\\x61
new RegExp('\\c' + p).source // \\ca

\ca wird als Steuerzeichen (Code 1) interpretiert, während \c\x61 die Sequenz \c gefolgt von a darstellt. Im Unicode-Modus (u oder v) lösen solche Konstrukte einen SyntaxError aus, was das Debugging erleichtert.

Google AdInline article slot

Leerzeichen und Interpunktion: Präventiver Schutz

Der Standard erklärt nicht, warum Leerzeichen und Zeichen wie @ escaped werden. Im TC39-Repository heißt es, dass alle Zeichen escaped werden, die künftig "Context-Escape" auslösen könnten. Dadurch wird der Einstieg und Ausstieg aus Kontexten auf Leerzeichen oder ASCII-Interpunktion beschränkt.

Dieser Ansatz ist umstritten: Er erzeugt Overhead ohne aktuellen Bedarf. Der Vorschlag für ein x-Flag, das Leerzeichen ignoriert, steckt in Stufe 1 von 4 fest.

Vergleich mit manuellen Funktionen

Klassische Escape-Funktion von MDN (2020):

Google AdInline article slot
function escapeRegExp(string) {
    return string.replace(/[.*+?^${}()|[\\]\\]/g, '\\$&');
}

Sie deckt Metazeichen ab, aber keine Ziffern oder Buchstaben. Eine verbesserte Version, die führende Ziffern und Bindestriche escaped:

function escapeRegExp(string) {
    const coolCmd = string => string.replace(/[.*+?^${}()|[\\]\\]/g, '\\$&')
        .replaceAll('-', '\\x2d');
    const charCode = string.charCodeAt(0);
    return charCode >= 0x30 && charCode <= 0x39
        ? `\\x${charCode.toString(16)}${coolCmd(string.slice(1))}`
        : coolCmd(string);
}

| Aspekt | RegExp.escape() | Custom (verbessert) |

|--------------------|------------------|---------------------|

| Führende Ziffern | \x32 | \x32 |

| Latein. Buchstaben | \x61 | Nein |

| Leerzeichen/@ | \x20/\x40 | Nein |

| Performance | Natürlich | RegExp-basiert |

Empfehlungen zur Nutzung

  • Für neuen Code: RegExp.escape() mit Polyfill für ältere Umgebungen verwenden.
  • Unicode-Modus: Immer das u-Flag hinzufügen – es fängt Fehler zur Parse-Zeit ab.
  • ESLint: Die Regel @eslint/regexp/no-octal-escape und require-unicode-regexp aktivieren.
// Polyfill nicht zwingend, aber nützlich
const polyfill = () => {
  RegExp.escape = RegExp.escape || function(s) {
    return s.replace(/[-[\]\/{}()\*+?\.\\^$|]/g, '\\$&');
    // Bei Bedarf erweitern
  };
};

Wichtige Punkte

  • RegExp.escape() escaped Ziffern/Buchstaben für die RegExp-Verkettung, Leerzeichen präventiv.
  • Ohne u-Flag werden Fehler maskiert; mit ihm gibt's SyntaxError zur Parse-Zeit.
  • Manuelle Funktionen sind veraltet: Auf die native Version mit Polyfill umstellen.
  • \cX vermeiden – es ist Legacy; explizite Codes nutzen.
  • Das x-Flag (Leerzeichen ignorieren) ist unwahrscheinlich.

— Editorial Team

Advertisement 728x90

Weiterlesen