3) Learn to Crawl Before You Can Run Lesson

Numbers and Mathematical Operators in JavaScript

11 min to complete · By Ian Currie

This lesson is about numbers and the main operators related to numbers. It is a long lesson, so take your time and play around with the examples in the console.

The Number data type holds a numerical value. A number can be either an integer (i.e. a whole number like 4 or 2300) or a floating-point number (i.e. a number with a decimal like 3.14 or 98.7).

What Operations Can You Perform on a Number

You can perform many mathematical operations with the numerical data type.

Basic Math Operators

As you might have guessed, Javascript Numbers can be added (+), subtracted (-), multiplied (*) and divided (/).

Examine this program and see if you can work out what is happening:

let sum = 0;
let difference = 0;
let product;
let quotient;

let firstNumber = 5;
let secondNumber = 3;

sum = firstNumber + secondNumber;
difference = firstNumber - secondNumber;
product = firstNumber * secondNumber;
quotient = firstNumber / secondNumber;

console.log(sum);
console.log(difference);
console.log(product);
console.log(quotient);

Remember to play around with these examples in the console!

Exponents and Roots

You can get the root (** 1/x) of a Number as well as perform exponentiation (** x).

let myNumber = 5;

let square = myNumber ** 2;

let squareRoot = myNumber ** (1 / 2);
let squareRoot2 = Math.sqrt(myNumber);

console.log(square);
console.log(squareRoot);
console.log(squareRoot2);

In this example you can see the exponent operator ** which raises a number to the left of it to the power of the number to the right of it. You can use this operator to take square roots or x roots of numbers by raising to the 1/2 for square root, or raising to the 1/x for the x root. You can also take a square root by using the Math object as shown in the example. Use whatever makes more sense to you!

Illustration of a lighthouse

In these examples some of the variables are immediately initialized to 0, though as you can see by the subsequent variables, you don't have to initialize it with a value. In fact, you don't need to initialize it separately at all as you can see in the exponent examples. They are all valid ways of initializing variables, it is up to you as to which is clearer and more readable.

Modulus

The modulus (%) returns the remainder left over from division.

let firstNumber = 5;
let secondNumber = 3;
let remainder = firstNumber % secondNumber; // 5 modulo 3
console.log(remainder); // This will print 2
remainder = 3 % 2; // 3 modulo 2
console.log(remainder); //This will print 1
remainder = 3 % 3; // 3 modulo 3
console.log(remainder); //This will print 0

The modulus operator is very useful in many applications. Here is an article that goes deep into the modulo operator, if you are interested. Modulus is useful for determining evenness (if x % 2 equals zero, it’s even), or for cycling through a fixed number of options (like looping back to the first item after the last).

Increment and Decrement Values

Say you had to take the sum of various numbers. One way of doing this might be:

let sum = 0;

sum = sum + 5;
sum = sum + 10;
Illustration of a lighthouse

You can use the same variable on both sides of the equals sign if the variable is already initialized. The right side of the expression is computed first. First the sum variable is loaded with its current value of 0, 5 is added to 0 to give 5, and then its result is assigned to the variable sum on the left side.

The shorthand way to do this is:

let sum = 0;

sum += 5;
sum += 10;
Illustration of a lighthouse

The two code blocks above do exactly the same thing.

Increment and Decrement Values by One

If you want to increment a value by one, you can simplify your code even further with the ++ operator:

let counter = 0;
++counter;
++counter;
++counter;
++counter;

console.log(counter); // 4

If you are decrementing a value by one, you can simplify your code with the -- operator:

let lives = 9;
--lives;
--lives;
--lives;

console.log(lives); // 6
Colorful illustration of a light bulb

You can also use the post-increment or post-decrement operator. Instead of the preceding ++ or -- it goes after the variable. For instance lives++. The difference is that the pre-increment/decrement operators return the value after incrementing/decrementing whereas the post-increment/decrement operators return the value before.

Note that this is just the return value of the expression, the end result is the same.

BigInt: A Data Type to Handle Larger Numbers

The Number data type does have a limit. A regular Number in JavaScript cannot exceed +/- 253. That is +/- 9,007,199,254,740,991. Also known as nine quadrillion seven trillion one hundred ninety nine billion two hundred fifty four million seven hundred forty thousand nine hundred ninety-one. You can use larger numbers if you really want to, but they introduce a loss of precision and some unexpected behavior which is due to the way that numbers are converted to the 64-bit binary format.

BigInt allows for precise representation of integers beyond the Number limit and is essential for certain mathematical operations where precision is critical, such as cryptography or working with large databases identifiers.

You typically will not need BigInt types, but if you ever do, remember a couple of gotchas:

  • You can't operate between BigInt and regular numbers, you'll need to convert numbers to BigInt if you want to divide a BigInt by 2, for example.
  • When you divide a BigInt, it's going to remove any fractional part of the number. So if you need decimal precision, you can't use BigInt!

How to Bypass the Limit

Luckily JavaScript has a data type called BigInt that can handle larger numbers. That said, support for this data type is not universal. You can check the support for BigInt or other features at the "can i use" website.

To use BigInt, you can either append the letter n to a number, or use the BigInt() operator function:

let bigNum = 9007199254740991n;
//                           ^
let sameBigNum = BigInt(9007199254740991);

BigInt can be used just like Numbers for arithmetic and comparison operations.

Summary: What Is a Javascript Number

  • Multiple mathematical operations can be applied on Javascript Numbers
  • Numbers can either be floating-points or integers
  • Floating-points are numbers with a decimal
  • Integers are whole numbers
  • Numbers have a limit: they cannot exceed +/- 253

What Operations Can You Perform on a Number

  • Additions, subtractions, multiplications and divisions
  • Exponents and roots
  • Modulus which returns the remainder left from a division
  • Increment and decrement values by one or more

BigInt: A Data Type to Handle Larger Numbers

  • BigInt is a datatype that can support larger numbers than the Number data type
  • Support for this data type is not universal