Everything you ever wanted to know about Numbers in Javascript

JavaScript is a popular programming language for web development that comes equipped with various features to handle numbers. In this article, we will explore in-depth how JavaScript handles numbers, best practices for parsing numbers, data types, caveats, and the BigInt type.

Data Types

JavaScript has two types of numbers: integers and floating-point numbers. Integers are whole numbers, while floating-point numbers have a decimal point. JavaScript uses the IEEE 754 standard for representing floating-point numbers. The standard specifies that floating-point numbers are stored in binary format, with a sign bit, an exponent, and a mantissa.

Besides integers and floating-point numbers, JavaScript also has a special value called NaN (Not a Number) that represents an undefined or unrepresentable value. For instance, dividing zero by zero results in NaN.

Parsing Numbers

When parsing strings into numbers, it is important to understand the difference between parseInt() and parseFloat(). parseInt() is used to convert a string to an integer. If the string does not start with a number, parseInt() returns NaN. parseFloat(), on the other hand, converts a string to a floating-point number. If the string does not start with a number, parseFloat() returns NaN.

A best practice when parsing numbers is to pass the radix parameter to parseInt(). This parameter specifies the base of the number system in the string being parsed. If the radix parameter is not provided, the default base is 10. For example:

parseInt("11", 2); // 3 (binary)
parseInt("11", 8); // 9 (octal)
parseInt("11", 10); // 11 (decimal)
parseInt("11", 16); // 17 (hexadecimal)

Number() Function

Another method for converting strings to numbers is the Number() function. The Number() function can convert both integers and floating-point numbers, as well as strings that contain only digits. If the string contains non-digit characters, Number() returns NaN. One important thing to note is that if the string starts with a zero, it is treated as an octal number, which can lead to unexpected results. To avoid this, you can use parseInt() with the radix parameter set to 10, or you can use the unary plus operator (+) to convert the string to a number. For example:

Number("123"); // 123
Number("123.45"); // 123.45
Number("0xFF"); // 255 (hexadecimal)
Number("010"); // 8 (octal)
Number("hello"); // NaN

parseInt("010", 10); // 10 (decimal)
+"010"; // 10 (decimal)

Caveats

JavaScript’s number type can handle a wide range of values, but it has its limits. The maximum value that can be represented in JavaScript is Number.MAX_VALUE, which is approximately 1.79e+308. Any value larger than this will result in Infinity. Similarly, the minimum value that can be represented is Number.MIN_VALUE, which is approximately 5e-324. Any value smaller than this will result in underflow and will be rounded to zero.

One caveat to be aware of is that floating-point numbers are not precise. Due to the way they are represented in memory, they can sometimes result in rounding errors. For example:

0.1 + 0.2; // 0.30000000000000004

It is important to keep this in mind when working with floating-point numbers and to use methods like toFixed() or toPrecision() to round numbers to a certain number of decimal places or significant digits.

BigInt Type

For working with very large numbers, JavaScript provides a BigInt type. BigInts are integers with arbitrary precision, which means that they can represent numbers of any size. BigInts can be created by appending the letter n to an integer literal or by calling the BigInt() function. For example:

const bigInt1 = 9007199254740991n;
const bigInt2 = BigInt("9007199254740991");

BigInts support all the standard mathematical operations, including addition, subtraction, multiplication, division, and modulus. However, BigInts cannot be mixed with regular numbers, so you’ll need to use the BigInt() function to convert regular numbers to BigInts before performing any calculations.

Conclusion

In conclusion, JavaScript provides various ways to handle numbers, including integers, floating-point numbers, and BigInts. When parsing strings to numbers, it is important to use the appropriate method, such as parseInt() or parseFloat(), and to be aware of potential caveats, such as rounding errors with floating-point numbers. It is also important to use BigInts for very large numbers, and to use the Number() function with caution when parsing strings that may contain non-digit characters or octal numbers. By following these best practices, you can effectively handle numbers in JavaScript and avoid potential errors and pitfalls.