@色少6年前
toLocaleString介绍
toLocaleString用于将对象根据语言的不同转换成某种语言环境下的字符串，同时也可以根据传入的参数来判断具体的表现形式。本文主要介绍Number和Date类型的toLocaleString方法.
参考：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString
谈一个面试中经常会被问道的问题：如何对数字进行千位符格式化？一般人可能想到的做法是换成字符数组循环手动插入,或者使用正则的方法。其实知道了toLocaleString完全可以不需要这么做，一行代码就能搞定。
1 2 | const num = 1122333444455551 num.toLocaleString() //1,122,333,444,455,551 |
Number.prototype.toLocaleString
支持两个参数。一个是语言代码，表示将数字格式化成哪国语言；另一个是格式化时的可选的一些属性，包括localeMatcher、style、currency、currencyDisplay、useGrouping、minimumIntegerDigits、minimumFractionDigits、maximumFractionDigits、minimumSignificantDigits、maximumSignificantDigits等。例如：
1 2 3 4 5 6 | const num = 1276482; num.toLocaleString('zh', { style: 'decimal' }) // 1,276,482，纯数字格式 num.toLocaleString('zh', { style: 'percent' }) // 127,648,200%，百分数格式 num.toLocaleString('zh', { style: 'currency', currency: 'CNY' }); // ￥1,276,482.00，人民币形式 num.toLocaleString('zh', { style: 'currency', currency: 'cny', currencyDisplay: 'code' }); // CNY1,276,482.00，currency不区分大小写 num.toLocaleString('zh', { style: 'currency', currency: 'cny', currencyDisplay: 'name' }); // 1,276,482.00人民币 |
上面提到的比较长的属性用来控制整数、小数位数和有效数字位数，可以分为两组。第一组是minimumIntegerDigits、minimumFractionDigits、maximumFractionDigits，应用场景是自动补0。
1 2 3 4 5 6 | const num = 1413.56; num.toLocaleString('zh', { minimumIntegerDigits: 7 }); //0,001,413.56 // 如果不想要分隔符可以指定useGrouping为false num.toLocaleString('zh', { minimumIntegerDigits: 7, useGrouping: false }); // 0001413.56 num.toLocaleString('zh', { minimumFractionDigits: 3, useGrouping: false }); // 1413.560 num.toLocaleString('zh', { maximumFractionDigits: 1, useGrouping: false }); // 1413.6 |
另一组是minimumSignificantDigits和maximumSignificantDigits，用来控制有效数字位数，只要设置了这一组属性，第一组的属性就会被忽略。
1 2 3 | const num = 141.56; num.toLocaleString('zh', { minimumSignificantDigits: 8 useGrouping: false }); // 141.56000 num.toLocaleString('zh', { maximumSignificantDigits: 3, useGrouping: false }); // 142 |
Date.prototype.toLocaleString
Date类型的语言代码一般用的不多，保持默认或者使用zh即可，格式化时的常用的属性主要有weekday、year、month、day、hour、minute。
weekday表示星期几（中文形式没有），可选属性有narrow、short、long，用来控制缩写的形式
1 2 3 4 | const date = new Date(); date.toLocaleString('en', { weekday: 'narrow' }); // M date.toLocaleString('en', { weekday: 'short' }); // Mon date.toLocaleString('en', { weekday: 'long' }); // Monday |
timeZoneName表示时区的表现形式，有short和long两个值
1 2 3 | const date = new Date(); date.toLocaleString('zh', { timeZoneName: 'short' }); // 2018/4/23 GMT+8 下午2:17:37 date.toLocaleString('zh', { timeZoneName: 'long' }); // "2018/4/23 中国标准时间 下午2:17:37" |
剩下的属性可以取值为numeric和2-digit来控制位数展示。不过好像对于小时、分钟、秒不起作用
1 2 3 | const date = new Date(Date.UTC(2012, 1, 2, 3, 1, 1)); // 2012/2/2 11:01:01 date.toLocaleString('zh', { hour12: false, year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric', second: 'numeric' }); // 2012/2/2 11:01:01 date.toLocaleString('zh', { hour12: false, year: '2-digit', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' }); // 12/02/02 11:01:01 |
兼容性
MDN地址：toLocaleString