DanLevy.net

Quiz: Können Sie auf JavaScript zählen?

Kennst du den Unterschied zwischen parseInt und parseFloat?

parseInt(" 123456.00")

Die parseInt‑Funktion ignoriert Leerzeichen und liest die anfängliche Ziffernfolge als Ganzzahl ein. Hier stoppt sie beim Dezimalpunkt, sodass nur 123456 zurückgegeben wird.

parseInt("123,456.00")

Im Allgemeinen stoppt parseInt die Verarbeitung, sobald es ein nicht‑numerisches Zeichen trifft. Hier stoppt es beim Komma, sodass nur 123 zurückgegeben wird.

0.1 + 0.2 === 0.3

Wegen Präzisionsfehlern bei Gleitkommazahlen ist 0.1 + 0.2 nicht exakt gleich 0.3. Durch die Art, wie Gleitkommazahlen im Speicher abgelegt werden, ergibt sich 0.30000000000000004. Der IEEE‑754‑Standard für die Behandlung von Gleitkommaarithmetik ist schuld, er kann manche Zahlen nicht exakt darstellen. Das ist ein verbreitetes Problem in allen Programmiersprachen. Irgendwann stößt man auf eine unendlich wiederholende Dezimalzahl, und egal welche Sprache man nutzt – der Computer muss einfach aufhören, unendlich viele Stellen zu verfolgen.

Einige Sprachen wie Python und Java bieten Decimal oder BigDecimal, um das zu lösen, aber JavaScript hat das nicht eingebaut. Man kann Bibliotheken wie big.js oder decimal.js verwenden, um solche Fälle zu behandeln.

(Hinweis: Manche Sprachen sind darauf ausgelegt, Brüche, imaginäre Zahlen usw. auf einer höheren logischen Ebene zu handhaben und literale Ausdrücke zu bewahren. Trotzdem müssen sie auf der Hardware‑Ebene dieselben Präzisionsprobleme mit Gleitkommazahlen bewältigen.)

Number.MAX_VALUE * 2

Da Number.MAX_VALUE die größte darstellbare reguläre Zahl in JavaScript ist, führt das Überschreiten seiner Grenze schnell zu einem Überlauf – im Grunde bekommst du sinnlose Ergebnisse. Das Multiplizieren mit 2 ergibt Infinity.

Weißt du, JavaScript ist manchmal so.

Was könnte das tun?

5..toFixed(2)

.toFixed(2) gibt eine String‑Darstellung von 5 mit zwei Dezimalstellen zurück, also ist das Ergebnis "5.00".

Der doppelte Punkt (5..toFixed(2)) ist ein ‘Trick’, um auf das Objektmodell von Zahlen‑Literalien zuzugreifen.

parseInt("42") === parseFloat("42")

In JavaScript interpretieren sowohl parseInt als auch parseFloat den String "42" als die Zahl 42. Deshalb ergibt der Vergleich parseInt("42") === parseFloat("42") true. Während parseInt das Parsen beim ersten Nicht‑Ziffer‑Zeichen stoppt, fährt parseFloat fort, bis es ein Zeichen trifft, das nicht zu einer Fließkommazahl gehört. Da im String "42" jedoch weder Dezimalpunkt noch andere nicht‑numerische Zeichen vorkommen, geben beide Funktionen denselben Wert zurück.

BigInt("42") === parseInt("42")

BigInt ist ein anderer Typ als number, daher ist parseInt("42") (eine reguläre Zahl) nicht streng gleich BigInt("42"). Zum Vergleich musst du beide in denselben Typ konvertieren: BigInt(parseInt("42")) === BigInt("42").

Was ergibt das?

parseInt("0x2A") === parseInt("2a", 16)

Jeder Eingabestring, der mit 0x beginnt, wird automatisch als Hexadezimal (Radix 16) behandelt. Er ist daher äquivalent dazu, einen Radix von 16 zu übergeben. Also ist parseInt("0x2A") dasselbe wie parseInt("2a", 16). (Groß‑ und Kleinschreibung ist egal.)

Was ist hier los?

parseInt('0xFF', 16)

parseInt mit einer hexadezimalen (16) Basis konvertiert "FF" zu 255 im Dezimalsystem. Vielleicht hast du das schon bei CSS‑RGB/Hex‑Farbwerten gesehen.

[24, 'One', 42].map(parseInt)

Das zweite Argument von parseInt (die Basis) stimmt mit dem index‑Argument der Array‑Methoden überein. Das führt zu unerwarteten Ergebnissen, da parseInt("One", 1) wegen der ungültigen Eingabe NaN zurückgibt.

Das erste Element, 24, wird in Basis 0 (automatische Erkennung) als 24 geparst, also bleibt es 24. Das zweite Element, 'One', wird in Basis 1 zu NaN geparst. Das dritte Element, 42, wird mit Basis 2 geparst. In Basis 2 ist '42' kein gültiger Wert, also ergibt das Ergebnis [24, NaN, NaN].

Das ist ein häufiger Stolperstein bei parseInt und map. Wenn du ein Array von Strings in Zahlen umwandeln willst, ist die einzige sichere „eingebaute“ Methode .map(Number) oder ein Callback/Wrapper wie .map(x => parseInt(x, 10)).

[24, 'Twenty1', 0o42].map(Number)

Number konvertiert Werte strenger in einen numerischen Typ als parseInt. Hier wird 'Twenty1' zu NaN, während 0o42 als oktales Literal erkannt und zu 34 konvertiert wird.

Was wird das Ergebnis dieses Codes sein?

console.log(parseInt(null), Number(null))

parseInt wandelt die Eingabe in einen String um, sodass null zu "null" wird. Da "null" keine gültigen dezimalen Zeichen enthält, liefert es NaN.

Number(null) liefert 0. weil JS dich gerne auf Trab hält. Warum? Nun, ich könnte tiefer gehen, falls Interesse besteht.

Was wird das Ergebnis dieses Zaubers sein?

parseInt(null, 36)

Da parseInt die Eingabe immer in einen String umwandelt, wird null zu dem String "null".

In Basis 36 (hexatrigesimal, falls du mitzählst), stellt der String "null" die Zahl 1112745 dar.

Die aufeinanderfolgenden Werte von nulk, null und nulm sind jeweils 1112744, 1112745 und 1112746 in Basis 36.

Vergleichstabelle

FunctionparseIntparseFloatNumberBigInt
Ignoriert Whitespace
.map(FN)☑️
Unterstützt Radix‑Argument
Binär/Octal/Hex‑Literale
Ungültige Zeichen 42 oh no4242NaNSyntaxError

Wie hast du abgeschnitten? 🧐

Brauchst du nach all dem Binärcode eine Pause?
Pftt, denk dran: Pause nach den Skills!

Geh zu my gym und knack noch ein paar Challenges! 💪