Cómo convertir un número a formato de moneda en JavaScript

Cómo convertir un número a formato de moneda en JavaScript

En JavaScript existe una API de internacionalización que nos permite formatear un número en un valor de moneda, porcentaje y decimal.

Por ejemplo: Si tenemos el precio de un producto como 2300.80 y queremos representar como un valor de precio como $2,300.80, el método Intl.NumberFormat() nos permite formatear a un valor más legible. Los ejemplos de abajo son funciones para formatear un valor a un valor dolar, euro y yen.

const value = 2300.8

const formatterDolar = new Intl.NumberFormat('en-US', {
	style: 'currency',
	currency: 'USD',
	minimumFractionDigits: 2,
	maximumFractionDigits: 2
})

formatterDolar.format(value) // $2,300.80

const formatterEuro = new Intl.NumberFormat('de-DE', {
	style: 'currency',
	currency: 'EUR',
	minimumFractionDigits: 2,
	maximumFractionDigits: 2
})

formatterEuro.format(value) // 2.300,80 €

const formatterYenes = new Intl.NumberFormat('ja-JP', {
	style: 'currency',
	currency: 'JPY',
	minimumFractionDigits: 2,
	maximumFractionDigits: 2
})

formatterYenes.format(value) // ¥2,300.80

Entiendo la API

El método Intl.NumberFormat() recibe dos parámetros de entrada: locales y options.

Parámetro locales

Nos permite especificar el idioma y región. Está compuesto por el código de idioma y el código de país. Por ejemplo:

'en-US' // idioma: inglés | código de país: Estados Unidos
'de-DE' // idioma: alemán | código de país: Alemania
'ja-JP' // idioma: japones 1 código de país: Japon

Parámetro options

Es un objeto que requiere 3 opciones principales: style indica el estilo del formato numérico.

  • decimal formato de número.
  • currency formato de moneda.
  • percent formato de porcentaje.

currency indica el tipo de moneda, por ejemplo: dólar, euro y yenes. minimumFractionDigits Indica los dígitos mínimos que se muestran después del punto decimal.

Buscaré compartir mis ideas, experiencias y tips con el propósito de lograr que quienes pasen por aquí puedan llevarse un poco de conocimiento.

Enlaces

Documentación Intl.NumberFormat

Compartir el artículo