HOWTO · JavaScript

Groß-/Kleinschreibung unempfindlicher String-Vergleich in JavaScript

Erfahren Sie, wie Sie Zeichenketten in JavaScript ohne Berücksichtigung der Groß- und Kleinschreibung vergleichen und wann localeCompare() oder reguläre Ausdrücke geeignet sind.

Auf dieser Seite

Bei Zeichenketten in JavaScript wird die Groß- und Kleinschreibung beim Gleichheitsvergleich berücksichtigt: "Hello" === "hello" ergibt false. Für einen einfachen Vergleich auf Gleichheit ohne Beachtung der Groß- und Kleinschreibung wandeln Sie beide Zeichenketten mit toLowerCase() um und vergleichen anschließend die Ergebnisse. Verwenden Sie localeCompare(), wenn sprachabhängige Sortierregeln wichtig sind, und einen regulären Ausdruck, wenn Sie ein Muster statt zwei vollständiger Zeichenketten abgleichen möchten.

Beide Zeichenketten für einfache Vergleiche in dieselbe Schreibweise umwandeln

Wandeln Sie beide Werte auf dieselbe Weise um, bevor Sie sie mit strikter Gleichheit vergleichen. toLowerCase() ist eine verbreitete Wahl; nach demselben Muster lässt sich auch toUpperCase() verwenden. Keine der beiden Methoden ist grundsätzlich vorzuziehen. Die Umwandlung ist für gewöhnliche Bezeichner und Benutzereingaben praktisch, stellt aber keine universelle Unicode-Faltung der Groß- und Kleinschreibung dar. Wenn Ihre Anwendung bestimmte Zeichen als gleich behandeln oder sprachspezifischen Regeln folgen muss, legen Sie das gewünschte Verhalten ausdrücklich fest und prüfen Sie es.

Das folgende Beispiel wandelt beide Werte in Kleinbuchstaben um und vergleicht sie:

const first = "Hello";
const second = "hello";
const equalIgnoringCase = first.toLowerCase() === second.toLowerCase();
console.log(equalIgnoringCase);
true

Für einen einfachen Gleichheitsvergleich funktioniert das, weil beide Werte vor dem strikten Vergleich vereinheitlicht werden. Die Methoden erzeugen umgewandelte Zeichenketten; die ursprünglichen Werte bleiben unverändert. Für sprachabhängige Gleichwertigkeit oder Sortierung verwenden Sie localeCompare() und wählen Sie die Optionen bewusst.

localeCompare() verwenden, wenn ein sprachabhängiger Vergleich wichtig ist

localeCompare() vergleicht Zeichenketten anhand von Sortierregeln und gibt eine Zahl zurück: 0 bedeutet, dass die Zeichenketten unter den gewählten Optionen als gleichwertig gelten. Ein negativer oder positiver Wert gibt ihre Sortierreihenfolge an. Für einen Gleichheitstest prüfen Sie, ob das Ergebnis 0 ist.

Die Option sensitivity legt fest, welche Unterschiede berücksichtigt werden. Bei "accent" wird die Groß- und Kleinschreibung ignoriert, während Akzentunterschiede erhalten bleiben. Bei "base" können sowohl Groß- und Kleinschreibung als auch Akzente ignoriert werden. Im folgenden Beispiel werden "café" und "CAFÉ" mit "accent" verglichen und gelten daher als gleichwertig. Eine Schreibweise ohne Akzent kann mit "base" ebenfalls als gleichwertig gelten. Das genaue Sortierverhalten hängt von der Spracheinstellung ab. Übergeben Sie eine Spracheinstellung, wenn Ihre Anwendung eine bestimmte sprachliche Sortierung benötigt, und prüfen Sie die Zeichenketten, die für Ihre Nutzer wichtig sind.

const result = "café".localeCompare("CAFÉ", undefined, { sensitivity: "accent" });
console.log(result === 0);
true

Verwenden Sie diesen Ansatz, wenn die Gleichwertigkeit den sprachabhängigen Sortierregeln folgen soll. Für einen einfachen Vergleich ohne Beachtung der Groß- und Kleinschreibung, der keine sprachspezifische Sortierung benötigt, ist die Umwandlung beider Zeichenketten einfacher.

Einen regulären Ausdruck verwenden, wenn Sie Muster abgleichen müssen

Ein regulärer Ausdruck eignet sich, um Text zu finden, der einem Muster entspricht. Mit dem Flag i wird die Groß- und Kleinschreibung beim Abgleich ignoriert. Die Methode test() gibt an, ob das Muster irgendwo in einer Zeichenkette vorkommt. Das ist kein allgemeiner Gleichheitsvergleich: Ein nicht verankerter Ausdruck kann nur einen Teil der Eingabe finden. Für einen exakten Vergleich mit einem vom Nutzer eingegebenen Text müssen Sie die Metazeichen des regulären Ausdrucks maskieren und das Muster an beiden Enden verankern. In JavaScript kann $ auch direkt vor einem abschließenden Zeilenabschlusszeichen passen. Der zusätzliche Endtest im Beispiel verlangt deshalb das tatsächliche Ende des Werts. Vor dem Erstellen des RegExp werden die eingegebenen Zeichen maskiert.

const userText = "JavaScript";
const escapedText = userText.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
const exactPattern = new RegExp("^" + escapedText + "$(?![\\s\\S])", "i");
console.log(exactPattern.test("javascript"));
true

Wenn Sie zwei Zeichenketten vergleichen möchten, sind die Umwandlung der Schreibweise oder localeCompare() meist verständlicher. Fügen Sie das Flag g nicht zu einem regulären Ausdruck hinzu, den Sie wiederholt mit test() verwenden, außer Sie verwalten lastIndex bewusst: Globale Tests können diesen Zustand zwischen Aufrufen verändern. Kurz gesagt: Verwenden Sie die Umwandlung für gewöhnliche Gleichheitsvergleiche, localeCompare() bei sprachabhängiger Gleichwertigkeit und reguläre Ausdrücke, wenn die Eingabe einem Muster entsprechen muss.