如何将数字格式化为货币字符串 [英] How to format numbers as currency string

问题描述

我想用JavaScript格式化价格.我想要一个以 float 作为参数并返回如下格式的 string 的函数:

I would like to format a price in JavaScript. I'd like a function which takes a float as an argument and returns a string formatted like this:

"$ 2,500.00"

做到这一点的最佳方法是什么?

What's the best way to do this?

推荐答案

Intl.NumberFormat

JavaScript has a number formatter (part of the Internationalization API).

// Create our number formatter.
var formatter = new Intl.NumberFormat('en-US', {
  style: 'currency',
  currency: 'USD',

  // These options are needed to round to whole numbers if that's what you want.
  //minimumFractionDigits: 0, // (this suffices for whole numbers, but will print 2500.10 as $2,500.1)
  //maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501)
});

formatter.format(2500); /* $2,500.00 */

示例

使用 undefined 代替第一个参数(示例中为'en-US')以使用系统语言环境(如果代码正在运行，则为用户语言环境)在浏览器中).语言环境代码的进一步说明

Use undefined in place of the first argument ('en-US' in the example) to use the system locale (the user locale in case the code is running in a browser). Further explanation of the locale code.

这是货币代码列表.

最后的注释，将其与较旧的. toLocaleString 进行了比较.它们都提供基本相同的功能.但是，toLocaleString的版本变旧(国际化之前)确实可以实际不支持语言环境:它使用系统语言环境.因此，在调试旧版浏览器时，请确保使用正确的版本( shim .

A final note comparing this to the older .toLocaleString. They both offer essentially the same functionality. However, toLocaleString in its older incarnations (pre-Intl) does not actually support locales: it uses the system locale. So when debugging old browsers, be sure that you're using the correct version (MDN suggests to check for the existence of Intl). No need to worry about this at all if you don't care about old browsers or just use the shim.

此外，对于单个项目，两者的性能相同，但是如果要格式化的数字很多，则使用 Intl.NumberFormat 大约是70倍快点.因此，通常最好使用 Intl.NumberFormat 且每个页面加载仅实例化1个.无论如何，这是 toLocaleString 的等效用法:

Also, the performance of both is the same for a single item, but if you have a lot of numbers to format, using Intl.NumberFormat is ~70 times faster. Therefore, it's usually best to use Intl.NumberFormat and instantiate only 1 per page load. Anyway, here's the equivalent usage of toLocaleString:

(2500).toLocaleString('en-US', {
  style: 'currency',
  currency: 'USD',
}); /* $2,500.00 */

关于浏览器支持和Node的一些说明

• 如今，浏览器支持已不再是一个问题，全球的支持率为98％，美国为99％，欧盟为99 +％.
• 有一个 shim 可以在化石浏览器(如IE8)上支持它真的需要
• 如果您使用的是Node，则可能 需要安装此处以获取更多信息
• 查看 CanIUse 了解更多信息

Some notes on browser support and Node

• Browser support is no longer an issue nowadays with 98% support globally, 99% in the US and 99+% in the EU
• There is a shim to support it on fossilized browsers (like IE8), should you really need to
• If you're using Node, you might need to install full-icu, see here for more info
• Have a look at CanIUse for more info

这篇关于如何将数字格式化为货币字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！