Способи конвертації тексту в числовий формат в JavaScript

Мова JavaScript, на відміну від Java, використовує неявну динамічну типізацію. Це може спричинити ряд проблем, які важко відстежити.

Розглянемо такий приклад:

var first="100";
var second="25";
var result=first-second;
console.log(result); 

Хоча змінні first та second є текстовими, при застосування оператора віднімання вони автоматично конветуються в числовий тип (Number) і результат виконання цього коду буде очікуваним: 75.

Але подивимось на такий приклад:

var first="100";
var second="25";
if(first>second){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

Тут результат буде неочікуваний: 25 більше за 100. Чому так? Змінні first та second є текстовими. При застосування оператора порівняння "більше" вони не конвертуються в числовий тип, а порівнюються як текст. Тобто використовуються лексикографічний порядок або, простішими словами, значення порівнюється "по алфавіту".

Зрозуміло що в цьому прикладі проблему можна вирішити просто прибравши лапки:

var first=100;
var second=25;
if(first>second){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

Але в на практиці ці значення можуть бути, наприклад, отримані із текстових полів, які заповнює користувач. Розглянемо можливі способи вирішення проблеми.

1. Використання Number()

Для конвертації в числовий тип можна використати конструктор Number() однойменного об'єкту-обгортки.

var first="100";
var second="25";
if(Number(first)>Number(second)){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

2. Використання оператора +

В JS оператор + можна використовувати як унарний оператор. Його використання змінить тип на числовий.

var first="100";
var second="25";
if(+first>+second){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

3. Використання математичних операцій

Для зміни текстового типу на числовий можна зробити просту арифметичну операцію зі змінною, що не змінює числового значення.

Наприклад, можна відняти 0 від кожної змінної:

var first="100";
var second="25";
if(first-0>second-0){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

Або помножити на 1 кожну змінну:

var first="100";
var second="25";
if(first*1>second*1){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

Але, якщо до кожного числа додати 0, то проблема не зникне. Оскільки для тексту оператор "+" працює, як оператор склеювання. Наприклад:

var varible="100";
console.log(varible+0);//1000

Тобто результат буде "1000" (текст). Можна застосувати інший оператор (чи одразу кілька операторів) для конвертації в числовий тип. Головне, щоб не змінився результат та код не став дуже заплутаний:)

4. Використання функції parseFloat()

Ця функція власне і призначена для конвертації тексту в число. Тому її застосування виглядає логічним:

var first="100";
var second="25";
if(parseFloat(first)>parseFloat(second)){
	console.log("100 більше за 25");
}else{
	console.log("25 більше за 100");
}

Зрозуміло, що вище перелічені не всі можливі способи вирішення проблеми. За потреби можна придумати й інші.