Intl 对象是 ECMAScript 国际化 API 的一个命名空间,它提供了精确的字符串对比、数字格式化,和日期时间格式化。Collator,NumberFormat 和 DateTimeFormat 对象的构造函数是 Intl 对象的属性。
这里我用几个有用的函数来展示Intl.NumberFormat(数字格式化)的用法
根据浏览器环境语言自动切换
在浏览器环境中,我们可以读取现在使用的语言。自动使用对应的语言进行格式化
export const numberFormatter = new Intl.NumberFormat(navigator.language, {
notation: "compact",
});
金钱格式化
对金钱的格式化,可以要求使用什么货币格式进行格式化
const number = 123456.789;
console.log(
new Intl.NumberFormat("de-DE", { style: "currency", currency: "EUR" }).format(
number,
),
);
// 输出 "123.456,79 €"
// 日本金融格式化
console.log(
new Intl.NumberFormat("ja-JP", { style: "currency", currency: "JPY" }).format(
number,
),
);
// 输出 "¥123,457"
// 中文元格式化
console.log(
new Intl.NumberFormat("zh-CN", { style: "currency", currency: "CNY" }).format(
number,
),
);
// 输出 ¥123,456.79
// 按千分位分隔
console.log(
new Intl.NumberFormat("en-IN", { maximumSignificantDigits: 3 }).format(
number,
),
);
// 输出 "1,23,000"
不同语种
让Intl对各种语言进行数字的格式化,在多语言环境中无需额外考虑不同语种格式化的问题
const number = 123456.789;
// 德语使用逗号(,)作为小数点,使用句号(.)作为千位分隔符
console.log(new Intl.NumberFormat("de-DE").format(number));
// → 123.456,789
// 大多数阿拉伯语国家使用阿拉伯语数字
console.log(new Intl.NumberFormat("ar-EG").format(number));
// → ١٢٣٤٥٦٫٧٨٩
// India uses thousands/lakh/crore separators
console.log(new Intl.NumberFormat("en-IN").format(number));
// → 1,23,456.789
// 通过编号系统中的 nu 扩展键请求,例如:中文十进制数字
console.log(new Intl.NumberFormat("zh-Hans-CN-u-nu-hanidec").format(number));
// → 一二三,四五六.七八九
// 当请求的语言不被支持,例如巴里,包含一个回滚语言印尼,这时候就会使用印尼语
console.log(new Intl.NumberFormat(["ban", "id"]).format(number));
// → 123.456,789
携带单位
可以带单位进行格式化
console.log(
new Intl.NumberFormat("pt-PT", {
style: "unit",
unit: "kilometer-per-hour",
}).format(50),
);
// 50 km/h
评论区
评论加载中...