JavaScript Intl.NumberFormat() Constructor

by

JavaScript Int.NumberFormat() constructor creates objects for Intl.NumberFormat(), which enables language-sensitive number formatting. This constructor can be called with or without a new keyword.

Syntax

new Intl.NumberFormat()
new Intl.NumberFormat(locales, options)

Parameters

  1. locales: A string with a BCP 47 language tag or an array of such strings.
  2. options: An object that can have properties like currencytDisplay, currencySign, signDisplay, useGrouping, localeMatcher, and many more.

Return Value

It returns a new Intl.NumberFormat object. 

Example 1: How to useIntl.NumberFormat() Constructor


let number = 2334567.89;
let formatter = new Intl.NumberFormat('en-US').format(number);
console.log(formatter);

Output

2,334,567.89

Example 2: Using currency formatting

let currency1 = 67229.34;
let currencyFormatter1 = new Intl.NumberFormat('en-US', 
                      { style: 'currency', currency: 'USD' }).format(currency1);
console.log(currencyFormatter1);


let currency2 = 67229.34;
let currencyFormatter2 = new Intl.NumberFormat('en-GB', 
                     { style: 'currency', currency: 'GBP' }).format(currency2);
console.log(currencyFormatter2);

Output

$67,229.34
£67,229.34

Example 3: Using unit formatting

let number = 4000;

let number1 = new Intl.NumberFormat('en-US',
 { style: 'unit', unit: 'liter' }).format(number);
console.log(number1);

let number2 = new Intl.NumberFormat('en-US',
 { style: 'unit', unit: 'liter',unitDisplay: "long" }).format(number);
console.log(number2);

Output

4,000 L
4,000 liters

Example 4: Using Decimal and Percentage formatting

let number = 4000;
let number1 = Intl.NumberFormat('en-US',
 { style: 'decimal'}).format(number);
 
let number2 = Intl.NumberFormat('en-US',
 { style: 'percent'}).format(number);

console.log(number1);
console.log(number2);

Output

4,000
400,000%

Browser Compatibility

Chrome Edge Firefox Safari Opera IE
Yes Yes Yes Yes Yes Yes

That’s it!

Related posts

JavaScript Intl.DateTimeFormat.format() Method

Leave a Comment