掘金 - 想偷懒的话,toLocaleString 了解一下?
MDN - Date.prototype.toLocaleString()
MDN - Number.prototype.toLocaleString()
其实就是在说: 这个API可以省很多事儿, 方便的对时间/数字按照一定格式进行转换, 不用你写正则, 不用你拖库
1.1 常用时间转换
以常用时间格式: YYYY-MM-DD HH:mm:ss
为例, 通常用库 day.js
或者 moment.js
来完成
format('YYYY-MM-DD HH:mm:ss') 复制代码
使用 toLocaleString
的话
new Date() .toLocaleString('zh', { hour12: false }) // "2019/4/21 13:00:09" .replace(/\//g, '-') // "2019-4-21 13:00:23" 复制代码
1.2 常用数字转换
例如: 整数部分每三位加一个逗号, 通常用正则完成
const number = 123456789 number.toString().replace(/\B(?=(\d{3})+\b)/g, ',') // "12,345,678" 复制代码
使用 toLocaleString
的话
const number = 123456789 number.toLocaleString() // "12,345,678" 复制代码
2. 坑
上面的一切看着都很美好, 虽然它有浏览器兼容问题, 但是我觉得在 node.js
中使用的话, 应该是可以把这份美好延续下去的
但是在一次提交中, 升级了 node
版本, 涉及到 toLocaleString
的地方都出现了很多问题
FROM node:8.9-alpine // 更改为 FROM node:lts-alpine 复制代码
打破了这份美好, 测试代码如下
// index.js console.log("en: " + new Date().toLocaleString('en', { hour12: false })) console.log("zh: " + new Date().toLocaleString('zh', { hour12: false })) // Dockerfile FROM node:8.9-alpine COPY . /app CMD ["node", "/app/index.js"] 复制代码
镜像 node:8.9-alpine
输出
en: 4/21/2019, 06:42:03 zh: 2019-4-21 06:42:03 (预期) 复制代码
镜像 node:10.15-alpine
输出
en: 4/21/2019, 06:43:13 zh: 4/21/2019, 06:43:13 复制代码
镜像 node:11.14-alpine
输出
en: 4/21/2019, 06:43:59 zh: 4/21/2019, 06:43:59 复制代码
镜像 node:11.14
输出
en: 4/21/2019, 06:46:54 zh: 4/21/2019, 06:46:54 复制代码
本地 node.js 11.13
输出, 怪不得本地调试是好的....
en: 4/21/2019, 14:49:27 zh: 2019-4-21 14:49:27 复制代码
Chrome浏览器
en: 4/21/2019, 14:51:33 zh: 2019/4/21 14:51:33 复制代码
3. 具体原因: 国际化支持
Node.js / JavaScript
的许多功能是提供国际化支持的, 例如
-
String.prototype.normalize()
-
String.prototype.toLowerCase()
-
Date.prototype.toLocaleString()
-
require('buffer').transcode()
-
...略
Node.js
(及其底层V8引擎)使用ICU实现这些功能
但是要支持世界上所有的语言环境需要一份非常大的ICU数据文件, 而大多数用户仅会使用ICU功能的一小部分, 因此 默认情况下Node.js仅提供完整ICU数据集的子集
3.1 构建Node.js的ICU选项
-
--with-intl=none/--without-intl
: 禁用所有国际化功能 -
--with-intl=system-icu
: 取决于系统, 大多数 linux 发行版都安装了ICU -
--with-intl=small-icu
(默认): 完整ICU的一部分, 基本等价于: 仅限英文 -
--with-intl=full-icu
: 完整的支持
3.2 在运行时提供ICU数据
- npm模块: full-icu: 安装完整的ICU数据
-
通过
npm i full-icu
, 数据文件将会拷贝在./node_modules/full-icu
,
-
通过设置环境变量
NODE_ICU_DATA
指定运行时的ICU选项
-
env NODE_ICU_DATA=/some/directory node
3.3 测试
-
npm install full-icu
, 确保package.json
中有full-icu
-
编写如下的Dockerfile
FROM node:lts-alpine WORKDIR /app COPY package.json /app RUN yarn --registry=https://registry.npm.taobao.org COPY . /app ENV NODE_ICU_DATA /app/node_modules/full-icu CMD ["node", "/app/index.js"] 复制代码
输出
en: 4/21/2019, 09:13:13 zh: 2019/4/21 09:13:13 复制代码
虽然和预期 2019-4-21 09:13:13
有点区别... 还是能说明有效吧- -
以上所述就是小编给大家介绍的《谨慎使用toLocaleString!!!》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- RecyclerView使用指南(一)—— 基本使用
- 如何使用Meteorjs使用URL参数
- 使用 defer 还是不使用 defer?
- 使用 Typescript 加强 Vuex 使用体验
- [译] 何时使用 Rust?何时使用 Go?
- UDP协议的正确使用场合(谨慎使用)
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Sexy Web Design
Elliot Stocks / SitePoint / 2009-03-28 / $39.95
Description A guide to building usable, aesthetically pleasing interfaces for web sites and web applications by applying timeless principles of user-centered design. This book focuses on practical ......一起来看看 《Sexy Web Design》 这本书的介绍吧!