javascript / beginner
Snippet
Umgang mit numerischen Datentypen bei Eingabebindungen
HTML-Eingabeelemente liefern standardmäßig Zeichenketten (Strings). In JavaScript und Svelte erfordert die zuverlässige Verarbeitung von Zahlen eine explizite Typumwandlung mit Funktionen wie parseFloat(), um unerwünschte String-Verknüpfungen und NaN-Fehler zu vermeiden.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
<script>let rawPrice = '19.99';let taxRate = 0.19;function calculateTotal(priceStr, tax) {const parsedPrice = parseFloat(priceStr) || 0;return Number((parsedPrice * (1 + tax)).toFixed(2));}</script><input type="text" bind:value={rawPrice} placeholder="Enter price" /><p>Total with Tax: {calculateTotal(rawPrice, taxRate)}</p>
svelte
Erklärung
1
const parsedPrice = parseFloat(priceStr) || 0;
Wandelt den String-Datentyp in eine Fließkommazahl um und liefert 0 als Fallback, falls das Parsing fehlschlägt.
2
return Number((parsedPrice * (1 + tax)).toFixed(2));
Berechnet den Gesamtbetrag, formatiert ihn auf zwei Nachkommastellen und wandelt das Ergebnis wieder in eine primitive Zahl um.