Rundungsfehler in JavaScript

Rundungsfehler in JavaScript

In JavaScript existieren Zahlen im Datentyp Number, wodurch man bei Rechenoperationen auf Rundungsprobleme stößt. Karsten Rieger, ehemaliger Professional Frontend Developer bei Neofonie, erklärt das Phänomen und stellt Lösungsansätze vor.

Wer Rechenoperationen mit JavaScript ausführen will, wird früher oder später auf ungenaue Ergebnisse stoßen.

Schauen wir uns ein Beispiel genauer an:

var result = 0.1 + 0.2;

result === 0.3

// false !

// result == 0.30000000000000004

Um zu verstehen, warum das so ist, muss man wissen, wie Zahlen in JavaScript verwaltet werden.

Der Datentyp Number

In JavaScript existiert für Zahlen nur ein Datentyp: Number.

Number ist ein 64Bit Floatingpoint  Datentyp. Diese 64 Bit werden dabei entsprechend dem Standard IEEE 754 (bzw. double precision binary floating point format) so aufgeteilt, dass die Bits 0 bis 51 für die Mantisse (den eigentlichen Zahlenwert), die Bits 52 bis 62 für den Exponenten und das letzte Bit (63) für das Vorzeichen verwendet werden.
Jede Zahl wird also in einer binären Exponential-Repräsentation abgebildet. Für Ganzzahlwerte bedeutet dies, dass eine gesicherte Darstellung bis 15 Ziffern möglich ist, bevor Rundungsfehler bedingt durch die exponentielle Abbildung auftreten.

Integer sind bis 15 Stellen sicher

var x = 999999999999999;   // 999999999999999

var y = 9999999999999999;  // 10000000000000000

Bei Fließkommazahlen wirkt sich dies entsprechend auf die Genauigkeit der Nachkommastellen aus (s. erstes Beispiel).

JavaScript steht nicht allein da

Wer sich nun bestätigt darin fühlt, dass JavaScript eine total verkorkste Sprache sei und nicht einmal ordentlich rechnen kann, wird erstaunt sein, dass dieses Problem nicht allein auf JavaScript beschränkt ist. Alle Sprachen, welche Fließkommazahlen nach IEEE 754 implementieren, weisen entsprechende Rundungsfehler auf. Der Unterschied besteht lediglich in den diversen Sprachen sich unterscheidenden zusätzlichen Datentypen.

Wer es nicht glaubt, kann gerne einmal in groovy (bzw. Java) folgendes ausprobieren:

Rundungsproblem in Java/Groovy

println"0.1 + 0.2 = ${0.1 + 0.2}"// "0.1 + 0.2 = 0.3"

println"0.1f + 0.2f = ${0.1f + 0.2f}"// "0.1f + 0.2f = 0.30000000447034836"

println"0.1d + 0.2d = ${0.1d + 0.2d}"// "0.1d + 0.2d = 0.30000000000000004"

Daran lässt sich auch gut erkennen, dass Number dem Datentyp Double in Java entspricht.

Eine Anekdote am Rande

Wem das alles nun viel zu kompliziert erscheint, der ist an dieser Stelle sicher nicht alleine. Wichtig ist es zu wissen, dass Rundungsfehler aufgrund der Abbildung entstehen können.

Selbst ein so genialer Kopf wie Steve Wozniak hat es vermieden einen Floatingpoint Datentyp in Apples erstem Basic zu implementieren. Laut Wikipedia war Wozniak zu sehr mit der Entwicklung des Diskettenlaufwerks beschäftigt, weshalb Microsoft  beauftragt wurde ein Basic mit Fließkommazahlen zu entwickeln (später genannt Applesoft Basic).

Sicher hätte Wozniak die intellektuellen Kapazitäten dazu gehabt, das Problem zügig zu lösen. Witzig ist jedoch, dass es nie eine offizielle Begründung gab, warum Wozniak damals keine Fließkommazahlen in Apple Basic umgesetzt hat. Während eines Interviews bei All Things Digital (2007) sagt Jobs auf die Frage, warum Wozniak keine Fließkommazahlen in Apple Basic umsetzte, lediglich: „This is one of the mysteries of life“.

Wie vermeidet man Rundungsfehler?

Ist man gezwungen mit großen Zahlen innerhalb von JavaScript zu rechen und sucht etwas analoges zu Javas BigDecimal, sollte man sich vielleicht bignumber.js oder BigDecimal.js einmal anschauen.

Für den gewöhnlichen Gebrauch genügt es jedoch meist, sich auf drei bis vier Stellen nach dem Komma zu beschränken und die nativen Methoden numObj .toPrecisionStelligkeit ) oder numObj .toFixedNachkommastellen ) zu verwenden. Der Unterschied zwischen beiden ist, dass man bei toPrecision() die Gesamtanzahl der darzustellenden Ziffern (Vorkomma + Nachkomma) angibt, während man bei toFixed() die Anzahl der darzustellenden Nachkommastellen angibt.

var result = parseFloat((0.1+ 0.2).toPrecision(1));

result === 0.3

// true

Zu beachten sei noch, dass sowohl .toFixed() als auch .toPrecision() als Rückgabewert kein Numberobjekt sondern einen String liefern, weshalb in dem oberen Beispiel auch noch einmal ein parseFloat() nötig ist, um auch einem Typvergleich (===) standzuhalten.

Neben einer Berechnung wie zuvor gesehen, ist auch bei der Übertragung von Zahlen darauf zu achten, ob diese eventuell implizit zu Number konvertiert werden. So interpretiert beispielsweise jQuery.data() den im Data-Attribut des angefragten Elements enthaltenen Wert. Ist dieser ein Zahlen wert, wird dieser entsprechend als Number zurückgegeben. Dies ist solange kein Problem, wie der Wertebereich Double eingehalten wird. Oft werden jedoch IDs auf diese Weise übertragen, welche wiederum gerne Long Werte sind und daher auch eine Stelligkeit jenseits der gesicherten 15 Stellen erreichen können. Um eine implizite Umwandlung zu vermeiden, sollte man daher auf das Data-Attribut, welches einen Long-Wert enthält zur Sicherheit mit der Methode jQuery.attr() zugreifen, welche stets einen String zurückliefert.

Wer das Problem der Rundungsgenauigkeit beim Abbilden von Fließkommazahlen in eine binäre Exponentialdarstellung selber einmal im Code lösen möchte, kann sich ja einmal am folgenden Coding Kata versuchen: Codewars – Float to binary conversion (wenn beim ersten Pageload eine Fehlermeldung erscheint, einfach erneut ein Reload versuchen)

Der vollständige Artikel kann auf entwickler.de gelesen werden.

Veröffentlicht am 10. Dezember 2015, aktualisiert am 10. Oktober 2020

Teilen auf
Karsten Rieger

Karsten Rieger

Karsten Rieger ist ehemaliger Professional Frontend Developer bei Neofonie. Seit 2006 hat er diverse technische Abteilungen wie ASP, Forschung und Entwicklung sowie Projects bzw. Software Factories durchlaufen. Sein Interesse gilt dabei verstärkt der Frontend-Entwicklung. Als Teil des Client Teams entdeckt er bei der Umsetzung diverser Kundenprojekte, dass hinter Frontend-Entwicklung mehr als „nur ein bisschen HTML und CSS“ steckt.

Noelani_Mac

noelani.de: Der neue Onlineshop für trendbewusste Frauen

Der femininen Schmuck von NOELANI erhält erstmalig eine eigene Onlinepräsenz. Von der Konzeption, über das Design bis zur Entwicklung auf Shopware 6 hat Neofonie den neuen Onlineshop umgesetzt.

KI & Forschung 09-2021

In der September-Ausgabe von „KI und Forschung“ werden die Themen Künstliche Intelligenz als Forschungsgebiet, Arbeiten in der Zukunft und Neuigkeiten von Google aus dem Search On Event vorgestellt.

ION ONE beim Digital Marketing Summit 2021

Der Digital Marketing Summit ist das Event des Jahres 2021 für Themen des digitalen Marketings und UX/UI. Axel Hillebrand von der UX-Agentur ION ONE ist mit einem Vortrag vertreten und zeigt, wie B2B-Websites in Lead-Maschinen verwandelt werden.

Whitepaper: Goldstandard für kundenspezifische Suchlösungen

Eine kontinuierliche Optimierung einer Suche ist unerlässlich. In dem Whitepaper „Goldstandard für kundenspezifische Suchlösungen“ stellt Cornelia Werk, Lead Consultant Search bei ontolux, Konzepte einer goldstandardbasierten Evaluation vor.

Index eines Buches

Neofonie startet Forschungsprojekt mit der HU Berlin

Zusammen mit dem Lehrstuhl der HU Berlin von Professor Alan Akbik, startet Neofonie das ZIM Projekt Semantische Begriffsanalyse für Information Retrieval Aufgaben (SEBIRA).

Header_Crossplan_PM

Crossplan Deutschland und Neofonie Mobile GmbH entwickeln Wrapper SDK für Audio-Apps

Mit dem neuen Wrapper SDK von Crossplan Deutschland stehen Audio-Publishern einfach und effizient alle benötigten SDKs für ein datengetriebenes App Advertising und Audio-Marketing zur Integration in die eigene App-Landschaft zur Verfügung. Radiostationen und Audio-Publisher können damit im Handumdrehen ihre Apps mit Datenmanagement-, Tracking- und Werbefunktionalitäten ausstatten.

Green_IT

Neofonie mit klimaneutraler Website

Neofonie setzt auf Green IT und ist bemüht, Emissionen so weit wie möglich zu reduzieren und Ressourcen umweltschonend einzusetzen. Jeder Klick auf neofonie.de ist klimaneutral. Neofonie unterstützt hierfür zertifizierte Klimaprojekte.

Guided Selling im B2B – digitale Vertriebsoptimierung

ION ONE unterstützt den B2B-Vertrieb, mithilfe von Guided Selling Workshops, um potenzielle Kunden effektiv zu beraten und Kunden vom Kauf zu überzeugen.

Managed Hosting mit mpex für maximale Sicherheit

Die Managed Hosting Lösungen unseres Partner mpex sorgen mit maximaler Sicherheit für beste Ergebnisse im Deployment und Betrieb von Neofonie und unser Kunden.

Core Web Vitals und deren Auswirkung auf die Webentwicklung

Mit der Einführung der Core Web Vitals Mitte Juni 2021 als zusätzliche Rankingfaktoren kommen auf die Webentwicklung neue Herausforderungen zu.

Geburtstagsverlosung bei ION ONE

ION ONE begeistert bereits seit einem Jahr seine Kunden. Feiern Sie das heutige Jubiläum mit und gewinnen Sie einen kostenfreien Workshop Ihrer Wahl.

Fussball_2021

Social Analytics zur UEFA EURO 2020

Wie wird über die spannendsten Ereignisse vor, während und nach den Spielen in den sozialen Netzwerken zur EURO 2020 gesprochen – eine Social Media Analyse von ontolux.

Sinnbild für Online Shopping

Warum eine goldstandard-basierte Evaluation?

Zur diesjährigen MICES trifft sich die E-Commerce-Suchgemeinschaft, um neueste Trends zu diskutieren. Mit dabei sind Cornelia Werk und Bertram Sändig von ontolux, die anhand von Kundenprojekten die Vorteile einer goldstandard-basierten Evaluation vorstellt.

amor_device_700

amor.de auf Shopware 6

Seit über 40 Jahren vertreibt Amor Echtschmuck und ist Europas Marktführer im mittleren Preissegment. Mit der Konzeption und Umsetzung des neuen Onlineshop hat der Schmuckhersteller Neofonie beauftragt.

DigitalHealthcare_Neofonie

Ausbau der Digitalisierung im Gesundheitswesen

Mit dem kürzlich beschlossenen Digitale-Versorgung-und-Pflege-Modernisierungsgesetz (DVPMG) verabschiedet der Bund bereits das dritte Gesetz, um die Digitalisierung im Gesundheitsmarkt voranzutreiben. Für die Vernetzung aller Beteiligten im Markt gestaltet Neofonie die Gesundheitstechnik von morgen aktiv mit und unterstützt Unternehmen, bei der Entwicklung von E-Health Lösungen.

Mit UX-Design die Customer Experience im Onlineshop beeinflussen

In der Videoreihe der media.net berlinbrandenburg zum Thema Customer Experience im E-Commerce, gibt Axel Hillebrand, UX Consultant von ION ONE, wertvolle Tipps, wie eine gute Usability und ein ausgefeiltes UX-Design Nutzer begeistert und so Ihre Conversion positiv beeinflusst.

Digitalen Wandel mit Managed IT-Services gestalten

Die stets an Komplexität gewinnenden Web- und E-Commerce-Projekte erfordern auf allen Ebenen ein Höchstmaß an Leistung, Sicherheit und Zuverlässigkeit. Bei diesen hohen Anforderungen wird Neofonie bereits seit 2004 durch das Berliner Hostingunternehmen mpex in allen Belangen des Betriebs unterstützt.

Digitales Recruiting – mit neuen Strategien gewappnet für die Zukunft

Celina Martin, HR-Managerin bei Neofonie Mobile war bei Digital Bash HR zu Gast und diskutierte mit HR-Experten zum Thema Digitales Recruiting in 2021 und gab Einblicke in HR-Strategien der Neofonie Mobile. Candidate Experience ist besonders wichtig im digitalen Wandel des Recruitings.

Container wird hochgehoben

Docker-Container als ideales Software-Transportmittel

Webprojekte werden immer komplexer und die Halbwertszeit der Technologien, die dabei zum Einsatz kommen, werden immer kürzer. Für die Softwareentwicklung ist die Containertechnologie von Docker ein ideales Transportmittel.

Corona-Reise-Check auf Shortlist für Deutschen Digital Award

In der Kategorie „Digital for Goods“ ist der Corona-Reise-Check des Wort & Bild Verlages für den Deutschen Digital Award 2021 nominiert. Der Bundesverband Digitale Wirtschaft e.V. hat in einer Shortlist die Vorauswahl getroffen.

Unser Newsletter „Neo Report“ vermittelt konkretes Praxiswissen, Trends und Know-how für Ihr digitales Business – quartalsweise und kompakt. Jetzt anmelden.