Intl provides powerful, flexible browser APIs for locale-aware formatting. Intl supports localized relative timings and dynamic duration selection for formatters. NumberFormat exposes a style option that enables unit formatting to represent measurements with units. Unit formatting converts numeric values into localized strings such as “5 ounces” or “9 pounds.” The Intl.supportedValuesOf('unit') API returns the set of unit identifiers supported by the runtime. Interactive demos can accept a numeric value and unit selection and render formatted results across multiple locales to illustrate differences and expected outputs.
It's been a little while since I last blogged about my favorite web platform feature, Intl. I think it was maybe two or so years ago when I was prepping for my first conference talk on the topic and using that as an opportunity to dig much deeper into the spec then I had before and wow, I was unprepared for how flexible, and powerful, this functionality is in the browser.
More recently, I blogged about dynamic time durations and how best to select the right duration for the formatter object. In both cases, the interesting aspect wasn't so much Intl, but rather, how best to use Intl when rendering your results. It was a pretty fascinating set of posts I think (ok, I'm biased perhaps) and I'm glad I investigated those parts of the spec.
Today I'm looking at another part of Intl - number formatting with units. When working with NumberFormat, the style option of the constructor reflects what kind of formatting you want to do. The options are: That last one may not be obvious and is the focus of my post today. Unit formatting is used for formatting a number of a certain type of thing, so for example, 5 ounces of water, or 9 pounds of sugar.
Collection
[
|
...
]