Javascript String match ()

Javascript String match () – Zeichenkette durchsuchen

Feb 2023

String match () durchsucht einen String anhand einer einfachen Zeichenkette oder nach variablen Teilstrings mit einem regulären Ausdruck. Wenn der String die Zeichenkette enthält, gibt match alle Treffer als Array zurück (oder null, wenn nichts gefunden wurde).

JS match – Suche nach einfachen Zeichenfolgen

Mit einem regulären Ausdruck kann match() z.B. nach verschiedenen Schreibweisen und Varianten des Suchmusters suchen. Wenn ein einfaches Suchmuster (z.B. zug) gefunden wird, gibt JS match den ersten Treffer zurück, und null sonst.

Das Word "Zug" hat viele Bedeutungen: das Verkehrsmittel der Bahn, der Zug durch offene Fenster, der Rosenmontagszug oder der Schachzug.

// Suche mit einfachem String
let result = text.match("Zug");

// Suche mit regulärem Ausdruck und Modifiern
let result = text.match(/zug/ig);

Wenn alle Vorkommen von »zug« oder »Zug« unabhängig von Groß- und Kleinschreibung gefunden werden sollen, muss match() mit einem regulären Ausdruck aufgerufen werden. Reguläre Ausdrücke suchen mit mehr oder minder komplizierten Suchmustern.

Im einfachsten Fall sitzt der Teilstring innerhalb eines öffnenden und schließenden Schrägstrichs. Die Modifier i (case insensitiv) und g (global) erweitern die einfache Suche: mit i ignoriert match() Klein- und Großschreibung, mit g durchsucht match() den kompletten String.

match() mit regulärem Ausdruck

Interessant wird die Suche mit match(), wenn verschiedene Ausdrücke bzw. Schreibweisen und Varianten gefiltert werden sollen. Ganz simpel: Finde Häßler in allen Schreibweisen.

Schreibt man Häßler oder Haessler, Haeßler, Hessler oder Heßler? Und findet man auch "haessler"?

let mynam = document.querySelector("#mynam").innerHTML;

                        ss oder ß  ────┐
                                       │
          ae oder ä oder e ────┐       │
                               ▼       ▼ 
let treffer = mynam.match(/H(ae|ä|e)(ss|ß)ler/ig);
                                              ▲▲
                         i für ignore case ───┘│
          g für global im gesamten String   ───┘

let allmatches = document.querySelector("#allmatches");
allmatches.innerHTML = treffer;

Und auch einfach: Findet Ziffern im Text.

Ab dem 5. Februar mehr als 20 Produkte im 3. Angebot!

const ziffern = document.querySelector("#ziffern").innerHTML;
const alleziffern = ziffern.match (/\d+/g);

function listArray (elem, index) {
	document.querySelector("#ziffern").innerHTML += `index[${index}] ${elem.trim()}<br>`;
}

alleziffern.forEach (listArray);

Am Rande: Strings in Backticks ` mit $-Zeichen – das ist ein Template-Literal. ${} wird ausgeführt und dann als String eingesetzt.

Suche nach HTML-Tags in einem Text

Strings sind Zeichenketten aus Wörtern, Zeichen oder Ziffern, die durch einfache oder doppelte Hochkommas vom Programmcode abgegrenzt sind.

<div>
  <a href="/javascript/Javascript-Strings.html">Strings</a> sind <em>Zeichenketten</em> aus Wörtern,
  Zeichen oder Ziffern, die durch einfache oder doppelte <strong>Hochkommas</strong> vom 
  <code>Programmcode</code> abgegrenzt sind.
</div>

["<div>", "<a href=\"/javascript/Javascript-Strings.html\">", "</a>", "<em>", "</em>", "<strong>", "</strong>", "<code>", "</code>", "</div>"] (10)

let matchTag = /<(?:.|\s)*?>/g;
let result = text.match (matchTag);
console.log (result);