Detailed example of using toLocaleString to format numbers in JavaScript

This article brings you relevant knowledge about javascript. It mainly introduces you to the detailed explanation of digital formatting using toLocaleString in JavaScript. Friends in need can refer to it. I hope it can be helpful. helped.

【Related recommendations: javascript video tutorial, web front-end】

toLocaleString

The problem of formatting numbers in projects is too common, especially when it comes to financial numbers. This time there is a need for various formats. In the past, I might have foolishly written functions myself, but This time I accidentally saw that there is such a useful function. Isn’t it a pure injustice before? -_-

Number.prototype.toLocaleString()

Parameters: numObj.toLocaleString([locales [, options]]).

The first parameter is an optional parameter, a string of abbreviated language code (BCP 47 language tag, for example: cmn-Hans-CN) or an array of these strings, some Unicode extensions Keys are also allowed. See MDN for details. If there are special regional formats, the local locales must be passed. Generally, passing the value undefined, zh or en can handle most situations. The default value is undefiend.

1. Divide numbers into thousandths

It is called directly, and the default is to divide into thousandths

var a = 123456.6789
a.toLocaleString() // 123,456.679,默认保留3位小数

If you don’t want to be divided into thousandths, you need An attribute is useduseGrouping: false

var a = 123456.6789
a.toLocaleString(undefined, {useGrouping: false}) // 123456.6789

2. How many decimal places to keep

Two attributes are mainly used here: Keep the minimum number of decimal placesminimumFractionDigits And keep the most decimal placesmaximumFractionDigits

var a = 123456.6789
a.toLocaleString(undefined, {minimumFractionDigits: 6}) //123,456.678900

Set the minimum number to keep to 6, then it will keep 6 decimal places

var a = 123456.6789
a.toLocaleString(undefined, {maximumFractionDigits: 2}) //123,456.68

If you want to keep two decimal places, Just set the maximum number of decimals to 2.

3. The minimum number of integer digits used minimumIntegerDigits

The range is 1-21, the default is 1

var a = 123456.6789
a.toLocaleString(undefined, {minimumIntegerDigits: 8}) //00,123,456.679

The minimum number of integer digits used, any shortage will be filled with zeros

4. The minimum number of significant digits used minimumSignificantDigits

The range is 1-21, the default is 1

var a = 123456.6789
a.toLocaleString(undefined, {minimumIntegerDigits: 8}) //00,123,456.679

5. The maximum number of significant digits used maximumSignificantDigits

The range is 1-21, the default is 21

var a = 123456.6789
a.toLocaleString(undefined, {maximumSignificantDigits: 6}) //123,457

4.5 The two properties of retaining valid digits are also very powerful. You can retain any valid digits, round off, and zeros will be added if there are insufficient digits.

6. The displayed style style

attribute style is a different style display option: the default is decimal. Options:

decimal: pure number

percent: percentage

unit: unit format, Use with unit, unit. Unit value

currency: Used for currency format. Note that this attribute cannot be used alone and must be used in conjunction with the currency attribute

var a = 123456.6789, 
a.toLocaleString(undefined, {style: 'decimal'}) //123,456.679
a.toLocaleString(undefined, {style: 'percent'}) // 12,345,668%
a.toLocaleString(undefined, {style: 'currency', currency: 'EUR'}) // €123,456.68
a.toLocaleString(undefined, {style: 'currency', currency: 'CNY'}) // ¥123,456.68
a.toLocaleString(undefined, {style: 'unit', unit: 'acre'}) // 123,456.679英亩

wherecurrency and currencyDisplay can also be used together. The former specifies the corresponding currency, such as USD, EUR and CNY ( Case-insensitive), the latter is the display style of currency symbols, the default currencyDisplay: symbol:

var a = 123456.6789, 
a.toLocaleString(undefined, {style: 'currency', currency: 'CNY', currencyDisplay: 'symbol'}) //  ¥123,456.68
a.toLocaleString(undefined, {style: 'currency', currency: 'CNY', currencyDisplay: 'code'}) // CNY 123,456.68
a.toLocaleString(undefined, {style: 'currency', currency: 'CNY', currencyDisplay: 'name'}) // 123,456.68人民币

the above are some toLocaleStringThe conventional format of numbers should be enough for daily format processing.

Of course, it also has Date.prototype.toLocaleString, Array.prototype.toLocaleString, you can learn about it yourself if you are interested.

【Related recommendations: javascript video tutorial, web front-end】

The above is the detailed content of Detailed example of using toLocaleString to format numbers in JavaScript. For more information, please follow other related articles on the PHP Chinese website!