Convert text to numbers JavaScript

Converting texts to parseInt numbers In JavaScript, we usually have a variable that has a number, but it is a String text and cannot be combined with an int number.

var number = 20;
var number2 = "30";
number+=number2;
console.log(number);

When you run the code the result in the browser in the console will be 2030 The text will be combined with the number.

The function of the javascript parseInt() command

If we want to collect them as numbers and convert this text str into a number we will use the parseInt command and within the parentheses we put the text variable we want to convert.

var number = 20;
var number2 = "30";
number+= parseInt(number2);
console.log(number);

Here when the result is displayed it will display 50 because we have converted the text to a number.

The function of the parseFloat command in JavaScript

If there are commas within the number in the text variable, the post comma will not be counted, it just takes the correct number. If we want to show us after the comma, we will use parseFloat() instead of parseInt() to show us after the comma and the letter F must be a capel character.

var number = 20;
var number2 = "30.5";
number+= parseFloat(number2);
console.log(number);

It will give a score of 50.5. Most of the html elements when we want to get the value from them the value is a String text type so if we want to get. On a value of type Int this can only be done using this parseFloat method.

Example

We will create an Input element of type Int.

In the html file is .

<input type="number" id="input" onkeydown="getValue()">

It is in the javascript file.

function getValue(){
	var number1 = document.getElementById("input").value;
	var number2 = 30;
	var result = number1 + number2;
	console.log(result);
}

In the previous example in the html file, we put the input element and we put the element of the data type numbers and we gave it an id in the name of input. And we set the onkeydown property and its task was to work when entering the keyboard, and we put the function that we created in the javascript file for it. In the javascript file, we created a function with the name getValue and created the first variable with the name number1 and linked it to the id we created in the html file. And the second variable is called number2 and its value is 30, and the second variable is called result and its value is the sum of the first and second variables, and we display the data through the console. When opening in the browser, the input button that we created will appear, launch the console, type numbers in the place of the input, and note the change in the console.

For example, if we write in the rectangle the number 45, we will notice in the console the number 430 appears, we change the values ​​as we want.

As we have noted when typing any value into the space a value appears in the console. But when we change the content of the first variable number1 to numbers in the following way it will work normally.

function getValue(){
	var number1 = document.getElementById("input").value;
	var number2 = 30;
	var result = parseInt(number1) + number2;
	console.log(result);
}

When you enter any value it will naturally sum it above the value 30 . And there is another way, which is to put Number instead of parseInt as follows

function getValue(){
	var number1 = document.getElementById("input").value;
	var number2 = 30;
	var result = Number(number1) + number2;
	console.log(result);
}