Question

94

Get the currency symbol for a locale

rated 0 times [ 96] [ 2] / answers: 1 / hits: 25731 / 6 Years ago, fri, june 1, 2018, 12:00:00

How to get the currency symbol for a given currency string (GBP, USD etc)? The best I've come up with seems ridiculously long winded, is there another way or am I better off with a lookup table?

const userLocale = EN-gb;

const userCurrency = GBP;

const withValueEl = document.querySelector(.withValue);

const withoutValueEl = document.querySelector(.withoutValue);

const valueWithCurrency = Number(0).toLocaleString(userLocale, {

  style: currency,

  currency: userCurrency,

  minimumFractionDigits: 2

});

const valueWithoutCurrency = valueWithCurrency.replace(Number(0).toLocaleString(userLocale, {

  minimumFractionDigits: 2

}), )



withValueEl.innerHTML = valueWithCurrency

withoutValueEl.innerHTML = valueWithoutCurrency

With value:<span class=withValue></span><br /> Without value:<span class=withoutValue></span><br />

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

tajo

Add To Favorites

Follow

Total Points: 415

Total Questions: 124

Total Answers: 103

Location: North Korea

Member since Tue, Jun 16, 2020

4 Years ago

answered 6 Years ago grayson · Accepted Answer

This looks like more work than it really is when you're including all of the DOM selector and value injection logic, which is not related to the functionality you want. Extracting the symbol is pretty straightforward:

const getCurrencySymbol = (locale, currency) => (0).toLocaleString(locale, { style: 'currency', currency, minimumFractionDigits: 0, maximumFractionDigits: 0 }).replace(/d/g, '').trim()

Or if you aren't using es6:

function getCurrencySymbol (locale, currency) {

  return (0).toLocaleString(

    locale,

    {

      style: 'currency',

      currency: currency,

      minimumFractionDigits: 0,

      maximumFractionDigits: 0

    }

  ).replace(/d/g, '').trim()

}

The toLocaleString options are verbose, so there's not much to do about that. But you don't need to use the Number constructor (really ever). If you get the currency value without decimals or separators it's simple to remove the numbers and have only the symbol left. You'll want to take this kind of approach because, depending on the locale and the currency, the symbol is not always a single character. For example:

getCurrencySymbol('en-US', 'CNY') // CN¥

getCurrencySymbol('zh-CN', 'CNY') // ￥

Trimming the result is also a good idea. You can chain .trim() to the result like in the examples, or update the regex to include whitespaces.
It should be noted this is a somewhat naive approach, since it only works for number characters 0-9. If you needed to include other number characters, such as Arabic (٠١٢٣٤٥٦٧٨٩), you'd need to update the regex to include unicode ranges: /[0-9u0660-u0669]/g. You'd have to add any other number system you need to support in similar fashion.

Localization is a non-trivial problem, so it might make more sense to just use a currency code to symbol map like this one.