Problem mit split() und includes()

[Nico R.]

Hallo zusammen,

ich habe das Problem, dass bei der Suche eines Teilstrings in einem String per include() ein unterschiedliches Resultat herauskommt, je nachdem, ob ich den String direkt suche (true) oder per split() extrahiert habe (false).

Wieso liefert include() hier unterschiedliche Ergebnisse? Ihr wisst das doch bestimmt...

Hier das Testscript: https://fsv-optik.de/tests/str_includes.html

Und hier der JS-Teil:

function split() {
    let t = "Test (1)";
    t = t.split("(");	
	return t[0];
}
function string() {
	return "Test";
}

let textfeld = "Test";

document.getElementById("ausgabe1").textContent = "type "+typeof split()+": ";
document.getElementById("ausgabe1").textContent += textfeld.includes(split());

document.getElementById("ausgabe2").textContent = "type "+typeof string()+": ";
document.getElementById("ausgabe2").textContent += textfeld.includes(string());

Schöne Grüße

Nico

[Nico R.]

Es lag am Leerzeichen vor der Klammer.

Schöne Grüße

Nico

[Rolf B]

Hallo Nico,

das klingt, als stündest Du mit den Entwicklerwerkzeugen nicht auf so vertrautem Fuße, wie man es sollte.

Denn bei solchen vermeintlichen Merkwürdigkeiten ist es eigentlich eleganter, die Experimente in der Konsole der Entwicklerwerkzeuge zu machen statt sich mit HTML einen abzubrechen.

 > "Test (1)".split("(")
 ▶ (2) ['Test ', '1']

und dann sieht man das überzählige Space gleich.

Oder zumindest haut man die Ergebnis mit console.log() in die Entwicklerkonsole und nicht in HTML-Elemente (wo Spaces nicht unbedingt auffallen).

Rolf

[Nico R.]

Hallo Rolf,

doch doch, meine eigentlichen Experimente hab ich mir in der Konsole ausgeben lassen. Den HTML-Kram hatte ich nur genutzt, damit im Testscript direkt was zu sehen ist.

Ich hatte mir allerdings nur das Ergebnis aus split() per console.log(split()) anzeigen lassen. Das hatt dann nur den String ohne Leerzeichen angezeigt. In dem Fall wärs natürlich klüger gewesen, noch einen Schritt weiter zurück zu gehen und console.log("Test (1)".split("(")) aus der Funktion zu testen. Aber da muss man dann schon eine genaue Idee haben, wo der Fehler zu suchen ist, was bei umfangreicheren Scripts eventuell gar nicht so leicht ist wie in meinem Fall.

Ich nehme an, es gibt keinen, sagen wir "erweiterten Ausgabemodus" für die Konsole, damit bei einem String generell auch Leerzeichen explizit angezeigt werden?

Schöne Grüße

Nico

[Rolf B]

Hallo Nico,

Ich nehme an, es gibt keinen, sagen wir "erweiterten Ausgabemodus" für die Konsole, damit bei einem String generell auch Leerzeichen explizit angezeigt werden?

Es gibt ein Leben jenseits von console.log(string) 😉

Im einfachsten Fall gibst Du selber Anführungszeichen aus. Aber Du kannst auch die Formatierungsfunktion der Konsole benutzen. Seit ca 2012 in allen damals relevanten Browsern verfügbar, sogar im IE10.

console.log("Das Ergebnis mit s lautet %s", split());
console.log("Das Ergebnis mit o lautet %o", split());

Das Ergebnis mit s lautet: Test 
Das Ergebnis mit o lautet: 'Test '

%o hat auch die nette Eigenschaft, in der Ausgabe einen Objektexplorer mitzuliefern, wenn Du damit ein Objekt formatieren lässt. Schau in den oben verlinkten Wiki-Artikel, was es noch an Möglichkeiten gibt.

Rolf

[Nico R.]

Das klingt vielversprechend. Aber…

console.log("Das Ergebnis mit o lautet %o", split());

liefert mir nur diese Ausgabe:

Das Ergebnis mit o lautet  Test 

Siehe auch: https://fsv-optik.de/tests/str_includes.html

Ich finde auch keinen Widerspruch zu: https://wiki.selfhtml.org/wiki/JavaScript/Console_API#Formatierung

Allerdings ist ja der zurückgegebene Wert nunmal nur ein String. Kann der denn überhaupt als Objekt ausgegeben werden?

Schöne Grüße

Nico

[Rolf B]

Hallo Nico,

MEH - ich weiß schon, weshalb ich Firefox nicht mag. Edge/Chrome bringen Anführungszeichen, der Fuchs nicht. Sorry, hätte ich vorher testen sollen. Aber wenn's sein muss, kannst Du die Anführungszeichen in den Formatstring packen. Chromia bringen dann zwei Anführungszeichen, aber doppelt hält bekanntlich besser 😉

String. Kann der denn überhaupt als Objekt ausgegeben werden?

Nun ja, in JavaScript ist irgendwie alles ein Objekt, auch wenn es zu Boolean, Number, BigInt und String primitive Gegenstücke gibt. Wenn Du auf einen primitiven Wert eine Methode anwendest, wird er flugs in ein Objekt umgewandelt ("boxing"). Nur auf undefined und null lässt sich keinesfalls eine Methode anwenden. Auch auf Number-Literale kann man nicht direkt Methoden anwenden, weil der Punkt als Dezimalpunkt verstanden wird. Aber wenn sie eingeklammert werden oder man die Methode über den Indexoperator beschafft, dann geht's wieder.

console.log(4.toFixed(3));      // 💥
console.log((4).toFixed(3));    // 😎
console.log(4['toFixed'](3));   // 🤪

Rolf

[Nico R.]

Hallo Rolf,

MEH - ich weiß schon, weshalb ich Firefox nicht mag.

achja, die Info hab ich natürlich vergessen. Ja, ich bin auf dem FF hängen geblieben. Ich hab schon mitgekriegt, dass neuerdings viel auf dem rumgehackt wird. Bis auf dass ich ihn manchmal etwas lahm finde beim Starten, kann ich mich eigentlich nicht beschweren.

Aber wenn's sein muss, kannst Du die Anführungszeichen in den Formatstring packen. Chromia bringen dann zwei Anführungszeichen, aber doppelt hält bekanntlich besser 😉

Irgendwie steh ich aufm Schlauch. Meinst du so?

console.log('Das Ergebnis mit o lautet:"%o"',split());

Dann bekomme ich diese Ausgabe:

Das Ergebnis mit o lautet:" Test  "

Bei genauem Hinsehen sieht man, dass da hinten noch ein weiteres Leerzeichen dran hängt. Schon mal nicht so schlecht, aber meintest du das so?

Schöne Grüße

Nico

[Rolf B]

Hallo Nico,

ja, so meinte ich das. Es ist natürlich sehr störend, dass das Füchslein von sich aus auch noch Leerstellen einfügt. Dann vielleicht doch lieber %s im Fuchs.

Rolf