Check out my books on Amazon at https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62
Subscribe to my email list now at http://jauyeung.net/subscribe/
The Number
JavaScript object is a wrapper object that lets us work with numbers by providing us with various constants and methods. A primitive number can be created by the Number()
function. A JavaScript number is a double-precision 64-bit binary format IEEE 754 value.
Creating a Number Object
We create a Number
object using the Number
function by writing the following code:
new Number('123');
const a = new Number('123');
const b = Number('123');
The main purpose of the Number
function is to create a number from a string. The Number
constructor used with the new
operator is for creating a Number
object, which is of type “object” instead of “number.” A number primitive isn’t an instance of Number
. The data type for a primitive number value is a number. The type with the typeof
operator and the constructor that it’s constructed from with the instanceof
operator, are as in the following code:
console.log(typeof new Number('123'));
console.log(new Number('123') instanceof Number);
We get “object” and true
respectively when we run the two lines of code above. On the other hand, if we write this code instead:
console.log(typeof Number('123'));
console.log(Number('123') instanceof Number);
We get number
and false
respectively.
The primary uses of the Number
object are for checking if an object can be converted to a number. If a non-number is passed into the Number
function, we get NaN
returned. If the Number
is used without the new
operator in a non-constructor context, it’s handy to use for type conversion.
The Number
object has the following properties:
-
Number.EPSILON
: the smallest interval between two representable numbers. -
Number.MAX_SAFE_INTEGER
: the maximum safe integer in JavaScript, 2⁵³ minus 1. -
Number.MAX_VALUE
: the largest positive representable number (1.7976931348623157e+308). -
Number.MIN_SAFE_INTEGER
: the minimum safe integer in JavaScript, -2⁵³ minus 1. -
Number.MIN_VALUE
: the smallest positive representable number; the positive number closest to zero without actually being zero. -
Number.NaN
: the "not a number" value. -
Number.NEGATIVE_INFINITY
: value representing negative infinity. -
Number.POSITIVE_INFINITY
: value representing infinity.
Static Methods
The Number
object has a few static methods.
Number.isNaN()
Determines whether the passed value is NaN
. Returns true
if a variable’s value is NaN
. For example, we can use it to determine if an object is a number with the following code:
console.log(Number.isNaN(+'abc')); // true
console.log(Number.isNaN(+'123')); // false
The first line logs true
because when 'abc'
is converted to a number with the unary +
operator, we get NaN
. On the other hand, the second line logs false
because when '123'
is converted to a number with a +
operator, we get 123
, which is a number, so the second line logs false
.
Number.isFinite()
Determines whether the passed value is a finite number. Returns true
if a number is finite and false
otherwise. For example, we can use it to determine if an object is a number with the following code:
console.log(Number.isFinite(Infinity)); // false
console.log(Number.isFinite(123)); // true
We get false
for the first line because Infinity
isn’t a finite number, but the second line logs true
because 123
is a finite number.
Number.isInteger()
Determines whether the passed value is an integer. Returns true
if the number is an integer and false
otherwise. For example, we can use this method as in the following code:
console.log(Number.isInteger(123)); // true
console.log(Number.isInteger(123.45)); // false
The first line logs true
because 123
is an integer, but the second line logs false
because it’s not an integer. If the argument passed is not of the number type then it will return false
. For example, Number.isInteger('10');
will return false
.
Number.isSafeInteger()
Determines whether an integer passed in the argument is within the range of a safe integer, i.e. if the number is between -2⁵³ minus 1 and 2⁵³ minus 1. For example, if we have:
console.log(Number.isSafeInteger(Math.pow(2, 53) - 1)); // true
console.log(Number.isSafeInteger(Math.pow(2, 53))); // false
The first line logs true
because Math.pow(2, 53) — 1
is within the safe range, but the second line logs false
because Math.pow(2, 53)
is not in the safe range.
Number.parseFloat()
The parseFloat
method converts a string that’s passed into the argument and returns a number that’s parsed from the string as a floating-point number. If it can’t be parsed, then NaN
is returned. For example, if we have:
console.log(Number.parseFloat('123.45'));
console.log(Number.parseFloat('123'));
console.log(Number.parseFloat('abc'));
We get 123.45
from the first line, 123
from the second line, and NaN
from the third line.
Number.parseInt()
The parseInt
method converts a string that’s passed into the argument and returns a number that’s parsed from the string as a whole number. If the first character of the string can’t be parsed, and the radix
is smaller than 11, then NaN
is returned. For example, if we have:
console.log(Number.parseFloat('123.45'));
console.log(Number.parseFloat('123'));
console.log(Number.parseFloat('abc'));
Then we get 123
from the first line and second line, and NaN
from the third line.
It also takes a radix
as the second argument, which is the base of the mathematical numeral systems. If the string starts with 0x
then the radix
will be set to 16. If the string starts with anything else, then the radix
will be set to 10.
To convert a hexadecimal string into a number, we can write something like the following:
console.log(Number.parseInt('0x1'));
We get 1
when the last line is run. To convert a binary string to decimal, we can write something like:
console.log(Number.parseInt('0111', 2));
The line above will log 7
, which is the decimal equivalent of the binary number 0111
.
Photo by Andrew Buchanan on Unsplash
Instance Methods
All Number
instances inherit from Number.prototype
, which provides the object with a few instance methods. The instance methods for Number
follow.
Number.toExponential()
The toExponential
method returns a string representing the number in exponential notation. It takes an optional that specifies the number of fractional digits to include. For example, we can write:
(123).toExponential(1);
Then we get 1.2e+2
.
Number.toFixed()
The toFixed
method returns a string representing the number in fixed-point notation. It takes an optional that specifies the number of fractional digits to include after the decimal point. For example, we can write:
console.log((123).toFixed(1));
And we get 123.0
.
Number.toLocaleString()
This method returns a string with a language-sensitive representation of the number. It overrides the Object.prototype.toLocaleString()
method. The first argument is the locales
argument, which takes one locale string or an array of locale strings. This is an optional argument. It takes a BCP 47 language tag with the optional Unicode extension key nu
to specify the numbering system for formatting the number. Possible values for nu
include: "arab"
, "arabext"
, "bali"
, "beng"
, "deva"
, "fullwide"
, "gujr"
, "guru"
, "hanidec"
, "khmr"
, "knda"
, "laoo"
, "latn"
, "limb"
, "mlym"
, "mong"
, "mymr"
, "orya"
, "tamldec"
, "telu"
, "thai"
, "tibt"
. The instance of the object created by the constructor has the format
method return a string with the formatted number.
The second argument accepts an object with a few properties: localeMatcher
, style
, unitDisplay
, currency
, useGrouping
, minimumIntegerDigits
, minimumFractionDigits
, maximumFractionDigits
, minimumSignificantDigits
, and maximumSignificantDigits
.
The localeMatcher
option specifies the locale-matching algorithm to use. The possible values are lookup
and best fit
. The lookup algorithm searches for the locale until it finds the one that fits the character set of the strings that are being compared. best fit
finds the locale that is at least as, but possibly more-suited than the lookup
algorithm.
Style
The style
option specifies the formatting style to use. Possible values for the style
option include decimal
, currency
, percent
, and unit
. decimal
is the default option and it’s used for plain number formatting, currency
is for currency formatting, percent
is for percent formatting, and unit
is for unit
formatting.
Possible values for thecurrency
property are ISO 4217 currency codes, such as USD
for the U.S. dollar and EUR
for Euro. There’s no default value. If the style
property is set to currency
then the currency
property must be provided. The currencyDisplay
property sets how the currency is displayed in currency formatting. Possible values are symbol
for adding localized currency symbols and is the default value, code
is for adding the ISO currency code, name
to use a localized currency name such as “dollar.” useGrouping
option is for setting the grouping separator to use for numbers. It’s a boolean value.
minimumIntegerDigits
, minimumFractionDigits
, and maximumFractionDigits
are considered one group of options. minimumIntegerDigits
specifies the minimum number of integer digits to use, ranging from 1 to 21, with 1 being the default option. minimumFractionDigits
is the minimum number of fraction digits to use, ranging from 0 to 20. The default is 0 for plain number and percent formatting. The default for currency formatting is specified by the ISO 4217 currency code list, and 2 if it’s not specified in the list. maximumFractionDigits
is the maximum number of fraction digits to use, with possible values ranging from 0 to 20. The default for plain numbers is the maximum between minimumFractionDigits
and 3. The default for currency formatting is the maximum between minimumFractionDigits
and the number of fractional unit digits provided by the ISO 4217 currency code list, or 2 if the list doesn't provide that information. The default for percent formatting is the maximum between minimumFractionDigits
and 0.
minimumSignificantDigits
and maximumSignificantDigits
are considered as another group of options. If at least one of the options in this group is defined, then the first group is ignored. minimumSignificantDigits
is the minimum number of significant digits to use, with possible values ranging from 1 to 21 with the default being 1. maximumSignificantDigits
is the maximum number of significant digits to use, with possible values ranging from 1 to 21, with the default being 21.
For example, we can use this method in the following examples:
const number = 123.45;console.log(number.toLocaleString('fr', {
style: 'currency',
currency: 'EUR'
}));
console.log(number.toLocaleString('zh-Hant-CN-u-nu-hanidec', {
style: 'currency',
currency: 'JPY'
}))
console.log(number.toLocaleString('en-IN', {
maximumSignificantDigits: 3
}));
The first console.log
statement will log 123,45 €
, the second console.log
will log ¥一二三
, and the third console.log
will get 123
.
Number.toPrecision()
The toPrecision
method returns a string representing the number to a specified precision in fixed-point or exponential notation. It takes an argument that optionally lets us specify the base between 1 and 100. If it’s not specified then all digits after the decimal point will be returned. For example, we can use it as in the following code:
const numObj = 5.12345;console.log(numObj.toPrecision());
console.log(numObj.toPrecision(100));
console.log(numObj.toPrecision(5));
console.log(numObj.toPrecision(2));
console.log(numObj.toPrecision(1));
We get the following logged for each line:
5.123455.1234500000000000596855898038484156131744384765625000000000000000000000000000000000000000000000000005.12355.15
Number.toString()
The toString
method returns a string representing the specified object in the specified radix
, or base of the number. It overrides the Object.prototype.toString()
method. The radix
is an optional argument that lets us specify the base between 2 and 36. The default radix
is 10. If the number is negative the sign is preserved. If it’s not a whole number, then a dot sign will be used to separate the decimal places. For example, we can write:
const count = 10;
console.log(count.toString()); // '10'
console.log((15).toString()); // '15'
console.log((15.2).toString()); // '15.2'
It also works for non-decimal numbers. For example, we can write:
console.log((-0b0111).toString(10)); // '-7'
It’s handy for converting numbers of different bases to other numbers.
Number.valueOf()
The valueOf
method returns the primitive value of the specified object. It overrides the Object.prototype.valueOf()
method. For example, if we have a Number
object constructed with the new
operator, we can write:
const numObj = new Number('10');
const numPrim = numObj.valueOf();
console.log(numPrim);
console.log(typeof numPrim);
We get the following logged when the code above is run:
10
number
Converting Other Objects to Numbers
With the Number
function, we can convert Date
objects and null
to numbers. For example, for Date
objects, we can write:
const d = new Date(2019, 0, 1, 0, 0, 0);
console.log(Number(d));
We get 1546329600000
, which is the UNIX timestamp for January 1, 2019. The null
object will be converted to 0, so if we write:
console.log(Number(null));
We get 0.
Conclusion
The Number
JavaScript object is a wrapper object that lets us work with numbers by providing us with various constants and methods. A primitive number can be created by the Number()
function. It has a number of useful static and instance methods for checking numbers and converting between strings and numbers and vice versa. The toString
method is also handy for converting numbers to different bases.