Programowanie webowe | 05. JavaScript potrzebny do egzaminu

Parsowanie liczb

Mirosław Zelent

Kiedy przetwarzamy liczbę w JavaScript, którą wczytaliśmy z pola edycyjnego (nawet pola typu number), to najlepiej dodatkowo – jak to mówimy – przeparsować jej wartość. Dajemy wówczas znać komputerowi, że dana zmienna na pewno jest numeryczna i unikamy kłopotliwych pomyłek. Rozważmy następujący skrypt:

HTML

<input type="number" id="a">
<input type="number" id="b">

<input type="button" value="DODAWANIE" onclick="suma()">

JavaScript

 function suma()
 {
   var a = document.getElementById("a").value;
   var b = document.getElementById("b").value;

   alert(a + b);
 } 

Rezultatem wykonania dla np. a=5 i b=7 będzie wartość 57, a nie 12. Otóż komputer potraktował wczytane wartości jak łańcuchy (napisy) i skleił znak “5” ze znakiem “7” (operator + jest przeciążony, to znaczy może służyć także do konkatenacji). Dopiero po przeparsowaniu wartości JavaScript będzie wiedzieć, że nas interesuje dodanie do siebie dwóch liczb, a nie sklejenie ze sobą łańcuchów. Nie zapomnij o parsowaniu na swoim egzaminie zawodowym!

Poprawione dodawanie zrealizowane jest następująco:

 function suma()
 {
   var a = document.getElementById("a").value;
   var b = document.getElementById("b").value;

   a = parseFloat(a);
   b = parseFloat(b);
   alert(a + b);
 } 

Oczywiście teraz rezultatem dla np. a=5 i b=7 jest już 12. Oprócz funkcji parseFloat() istnieje także funkcja parseInt():

• parseFloat() – parsuj do liczby zmiennoprzecinkowej (ang. floating point = liczba zmiennoprzecinkowa, np. 3.14)
• parseInt() – parsuj do liczby całkowitej (ang. integer = liczba całkowita)