indexOf und search() – String durchsuchen

Javascript String search, durchsuchen

search () sucht eine Zeichenkette im String und gibt die erste Position oder -1 zurück. search () sucht anders als indexOf auch nach Variationen des Suchmusters mit einem regulären Ausdruck.

23-02-02 SITEMAP CSS HTML JS Basis JS Web Tutorial SVG

indexOf / lastIndexOf

indexOf() sucht nach einer einfachen Zeichenkette. search() sucht auch nach Variationen einer Zeichenkette anhand von regulären Ausdrücken. Wenn nur eine einfache Zeichenkette gesucht wird, ist indexOf() schneller und kann die Suche zudem von einem bestimmten Index aus beginnen.

Javascript indexOf (str [,index]) ermittelt die erste Position eines einfachen Strings innerhalb eines anderen Strings und sucht optional von einer Startposition index aus.

Gibt -1 zurück, wenn die Zeichenkette nicht gefunden wird.

                 // 0123456789012345678901234
let simpleString = "Ich bin eine Zeichenkette";

console.log ("indexOf 'eine' " + simpleString.indexOf("eine"));
console.log ("indexOf 'eine' ab Pos 10 " + simpleString.indexOf("eine",10));
console.log ("indexOf 'Wort' " + simpleString.indexOf("Wort"));
console.log ("lastIndexOf 'Zeichen' " + simpleString.indexOf("Zeichen"));
[Log] indexOf 'eine' 9 
[Log] indexOf 'eine' ab Pos 10 -1 
[Log] indexOf 'Wort' -1 
[Log] lastIndexOf 'Zeichen' 14 

lastIndexOf (str [,index]) findet die letzte Position einer einfachen Zeichenkette str und sucht optional von einer Startposition index aus.

Gibt -1 zurück, wenn der String str nicht gefunden wird.

String search ()

Javascript str.search(pattern) gibt die erste Fundstelle des Suchmusters (pattern) zurück, wenn str gefunden wird, und -1 sonst.

Bei einem einfachen String als Suchmuster / Pattern gibt es keine Möglichkeit, die Suche unabhängig von Klein-/Großschreibung durchzuführen oder nach Variationen zu suchen.

Anstelle eines einfachen Strings kann Javascript search() (genauso wie match()) mit einem regulären Ausdruck aufgerufen werden. Dann kann die Suche im Text Groß- und Kleinschreibung unterscheiden.

Ob Anzug oder Aufzug, Durchzug oder Einzug: Das Word "Zug" hat viele Bedeutungen und kann mit vielen Vorsilben bestückt werden.

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

// Suche mit regulärem Ausdruck
let result = text.search (/Zug/i);

Reguläre Ausdrücke sehen schnell aus, als hätte die Katze die Tastatur in Beschlag genommen – aber für den Anfang reichen die einfachen Varianten.

Bei so einem einfachen Beispiel unterscheidet sich der reguläre Ausdruck vom einfachen String nur durch die Schrägstriche anstelle von Hochkommas. Den größeren Unterschied macht das i (case-insensitiv), das auch als Modifier des regulären Ausdrucks bezeichnet wird.

search () gibt -1 zurück, wenn der Suchstring nicht gefunden wird.

Bunte Badenixen baden im Wasser
let result = document.querySelector("#noword").innerHTML.search("Baum");
console.log ('result ' + result);
noresult -1

Suchen nach mehreren Strings

Dass string.search(r) mit einem regulären Ausdruck aufgerufen werden kann, macht eine Suche nach mehr als einer Zeichenkette möglich. Zwar akzeptiert search() nur ein einziges Argument, aber einen Regex-Ausdruck mit | (oder).

Rosen, Tulpen, Nelken, alle Blumen welken.
const flowers = document.querySelector ("#flowers").innerHTML;

console.log ("flowers ohne i", flowers.search (/rosen|tulpen|nelken/)); // -1
console.log ("flowers mit i ", flowers.search (/rosen|tulpen|nelken/i)); // 0

Die erste Konsolenausgabe liefert -1 (nichts gefunden), weil die Suchbegriffe in Kleinbuchstaben geschrieben sind.
Die zweite Ausgabe findet rosen direkt auf Index 0.

String-Suche im Vergleich

Da haben wir indexOf, search() und match() für die Suche nach einer Zeichenkette in einem String. Wo sind die Unterschiede?

Such-Methodemit Regex?ErgebnisKein Treffer
indexOf / lastIndexOfneinErste Position des Suchbegriffs, kann ab einem bestimmten Index suchen-1
match()jaAlle Suchbegriffe als Arraynull
search()jaErste Position des Suchmusters, kann mit einem regulären Ausdruck suchen-1

Neben den Such-Methoden des String-Objekts gibt es die Such-Methoden des Regex-Objekts.

Regex-SucheErgebnisKein Treffer
exec()Erste Position des Suchmustersnull
test()truefalse

Suchen im String mit exec(): Position aller Fundstellen

search() ist eine Methode des String-Objekts. Reguläre Objekte haben ebenfalls Methoden, die nach den Vorkommen von Zeichenketten in einem String suchen: exec() und test(). Die Methoden regulärer Ausdrücke werden auf dem regulären Ausdruck ausgeführt und ihr Argument ist der String.

exec() findet nur die erste Position eines Suchmusters im String und gibt entweder die Position oder null zurück, wenn kein Treffer gefunden wurde. Um die Position aller Fundstellen zu erhalten, muss der String in einer Schleife durchlaufen werden.

let regex = /zug/gi, result, indices = [];
while (result = regex.exec(str)) {
    indices.push("" + result.index);
}
console.log (indices);
Array (5)
0 "5"
1 "17"
2 "27"
3 "39"
4 "54"

Suchen und Ersetzen mit einem RegExp-Objekt funktioniert genauso wie mit der /…/-Syntax – nur eben mehr objektorientiert und mit den gewohnten Hochkommas.

exec(s) führt einen regulären Ausdruck auf einer Zeichenkette str aus und gibt detallierte Informationen zu den Treffern zurück.

regex.test() – Kommt das Suchmuster im String vor?

Die Methoden von strings – match(), replace(), search() haben einen Parameter gemeinsam – das Suchmuster – und sie werden über die Dot-Notation auf dem String aufgerufen:

     String --+   Methode   +-- Suchmuster
              |     |       |
let result = str.match("Pattern");
let result = str.repace("Pattern", "Ersetzung");

test() hingegen ist eine Methode des Regex-Objekts und wird auf dem Suchmuster aufgerufen.

test() ist die einfachste und schnellste Variante für die Suche nach einem Suchmuster (Pattern) in einem String. test(str) sucht den String str und gibt true zurück, wenn str gefunden wird, und false sonst.

const textline = "Der Pfad zu dieser Bilddatei ist 'https://www.mediaevent.de/javascript/img/buffalo-mini.webp'";
const pattern = "/img/buffalo-mini.webp";

// Regulären Ausdruck vom Suchstring erzeugen
const regex = new RegExp (pattern);

console.log ("regex.test(textline)" , regex.test(textline));
> regex.test(textline) – true