JavaScript allows you to use integer and floating-point numbers. You can easily represent these numbers in decimal, hexadecimal, or octal notations.
JavaScript doesn’t differentiate between integers and decimal numbers. All the numbers are displayed as floating-point numbers.
var x = 6; // integer number
var y = 2.56; // floating-point number
var z = 0abc; // hexadecimal number
You can represent large numbers in exponential form. For example: 5.65e+32 (5.65x1032)
var x = 2.53e4; // same as 25300
var y = 8.13e+6; // same as 8.13e6 or 8130000
var z = 8.13e-6; // same as 0.00000813
9007199254740991 (253-1) is the largest safe integer in JavaScript.
-9007199254740991 (-(253-1)) is the smallest safe integer in JavaScript.
You can represent numbers in hexadecimal notation with 16 as a base. 0x is used as a prefix for hexadecimal numbers.
var x = 0x00; // same as 0
var y = 0xc6; // same as 198
Let’s have a close look at the below mentioned examples.
var x = 5;
var y = 10;
var z = "15";
// Adding a number with a number, the result will be sum of numbers
document.write(x + y); // 15
document.write("<br>");
// Adding a string with a string, the result will be string concatenation
document.write(z + z); // '1515'
document.write("<br>");
// Adding a number with a string, the result will be string concatenation
document.write(x + z); // '515'
document.write("<br>");
// Adding a string with a number, the result will be string concatenation
document.write(z + x); // '155'
document.write("<br>");
// Adding strings and numbers, the result will be string concatenation
document.write("The result is: " + x + y); // 'The result is: 510'
document.write("<br>");
// Adding numbers and strings, calculation performed from left to right
document.write(x + y + z); // 'The result is: 1515'
Here, the output of the last operation is not a string concatenation. This is because the operators having the same precedence are calculated from left to right. Variables x and y are added and their output is added to Z (string variable). Therefore the final output is 15 + “15” = “1515”.
However, you will get different outputs with mathematical operations such as multiplication, division, and subtraction. The numeric strings are converted to numbers as follows:
var x = 5;
var y = 10;
var z = "10";
// Subtracting a number from a number
document.write(y - x); // 5
document.write("<br>");
// Subtracting a number from a numeric string
document.write(z - x); // 5
document.write("<br>");
// Multiplying a number with a numeric string
document.write(x * z); // 50
document.write("<br>");
// Dividing a number with a numeric string
document.write(z / x); // 2
When you multiply or divide numbers with non-numeric strings, you get NaN (Not a Number) as output.
var x = 5;
var y = "apple";
var z = NaN;
// Subtracting a number from a non-numeric string
document.write(y - x); // NaN
document.write("<br>");
// Multiplying a number with a non-numeric string
document.write(x * y); // NaN
document.write("<br>");
// Dividing a number with a non-numeric string
document.write(x / y); // NaN
document.write("<br>");
// Adding NaN to a number
document.write(x + z); // NaN
document.write("<br>");
// Adding NaN to a string
document.write(y + z); // appleNaN
You can use the keywords Infinity and –Infinity to display positive and negative infinity.
var x = 10 / 0;
console.log(x); // Infinity
var y = -10 / 0;
console.log(y); // -Infinity
Tip: If you want a number for an infinity value, use the typeof operator.
When you perform operations on decimal numbers, it may give unpredictable outputs.
var x = 0.1 + 0.2;
console.log(x) // 0.30000000000000004
The expected output is 0.3, however you get 0. 30000000000000004. This variation is known as the roundoff error or representation error. JavaScript uses a binary number system to handle decimal numbers. This causes the difference.
The below example explains how you can solve the above problem.
var x = (0.1 * 10 + 0.2 * 10) / 10;
console.log(x) // 0.3
JavaScript offers methods and properties that help you carry out operations on numeric values.
Here are some number methods that you can use:
Parsing Integers from Strings: The parseInt( ) allows you to parse an integer from a string value. You can use this method when you are working with CSS units such as 40 px, 8 pt, where you need to retrieve the numeric value.
When the parseInt( ) method comes across a character in the predefined base, it puts parsing to end and gives back the integer value parsed up to that point. When the first character can’t be changed into a number, you will get NaN (not a number).
document.write(parseInt("6.28") + "<br>"); // 6
document.write(parseInt("25px") + "<br>"); // 25
document.write(parseInt("8pt") + "<br>"); // 8
document.write(parseInt("0xcb", 16) + "<br>"); // 203
document.write(parseInt("15 years") + "<br>"); // 15
document.write(parseInt("Year 2067") + "<br>"); // NaN
document.write(parseInt("10 11 2022")); // 10
The parseFloat( ) method helps you parse floating-point numbers from a string.
document.write(parseFloat("6.28") + "<br>"); // 6.28
document.write(parseFloat("25px") + "<br>"); // 25
document.write(parseFloat("2.8em") + "<br>"); // 2.8
document.write(parseFloat("144.9 lbs") + "<br>"); // 144.9
document.write(parseFloat("weight 111.7 lbs") + "<br>"); // NaN
document.write(parseFloat("11.15 acres")); // 11.15
The toString( ) method helps you convert numbers into strings.
var x = 15;
var y = x.toString();
document.write(y); // '10'
document.write(typeof y + "<br>"); // 15string
document.write(typeof x + "<br>"); // number
document.write((15).toString() + "<br>"); // '15'
document.write((19.3).toString() + "<br>"); // '19.3'
document.write((7).toString(2) + "<br>"); // '111'
document.write((155).toString(16)); // '9b'
The toExponential( ) method is used to format a number in exponential notation. The exponential notation helps you with very small and very big numbers. You can even pass an integer argument that specifies the number of digits following the decimal.
var x = 49.1354;
document.write(x.toExponential() + "<br>"); // 4.91354e+1
document.write(x.toExponential(6) + "<br>"); // 4.913540e+1
document.write(x.toExponential(4) + "<br>"); // 4.9135e+1
document.write(x.toExponential(2)); // 4.91e+1
The toFixed( ) method helps you format a number according to the fixed number of digits present to the right of the decimal. You get a string as the output and it contains the pre-defined number of digits following the decimal point. When you omit the digits parameter, it is considered as 0.
var x = 51.635;
document.write(x.toFixed() + "<br>"); // '52' (note rounding, no fractional part)
document.write(x.toFixed(2) + "<br>"); // '51.63' (note rounding)
document.write(x.toFixed(1) + "<br>"); // '51.6'
var y = 8.35e+9;
document.write(y.toFixed(2) + "<br>"); // '8350000000.00'
var z = 2.34e-3;
document.write(z.toFixed(2)); // '0.00'
The toPrecision( ) method helps you get the appropriate form of a number. You get a string that represents the number to the predefined precision.
var x = 3.456;
document.write(x.toPrecision() + "<br>"); // '3.456'
document.write(x.toPrecision(3) + "<br>"); // '3.46' (note rounding)
document.write(x.toPrecision(2) + "<br>"); // '3.5'
document.write(x.toPrecision(1) + "<br>"); // '3'
var y = 15.86;
document.write(y.toPrecision(2) + "<br>"); // '16' (note rounding, no fractional part)
var z = 4567.2;
document.write(z.toPrecision(2)); // '4.6e+3'
The Number.MAX_VALUE helps you represent the biggest numbers. The Number.MIN_VALUE helps you represent the smallest numbers.
var a = Number.MAX_VALUE;
document.write(a + "<br>"); // 1.7976931348623157e+308
var b = Number.MIN_VALUE;
document.write(b + "<br>"); // 5e-324
The valueOf( ) method helps you return a number as a number.
var x = 678;
document.getElementById("demo").innerHTML = x.valueOf() + "<br>" + (678).valueOf() + "<br>" + (600 + 78).valueOf();