首页 > 其他分享> 文章详细

toLocalDateString的用途

2021-06-26 19:01:32 阅读：217 来源： 互联网

标签：18 toLocalDateString long 用途 Date new options numeric

toLocaleDateString

toLocaleDateString方法返回该日期对象日期部分的字符串，该字符串格式因不同语言而不同。新增的参数 locales 和 options 使程序能够指定使用哪种语言格式化规则，允许定制该方法的表现（behavior）。

在旧版本浏览器中， locales 和 options 参数被忽略，使用的语言环境和返回的字符串格式是各自独立实现的

Date.prototype.toLocaleDateString()

Date

Date 实例转为表示本地时间的字符串，有常见三种方法

Date.prototype.toLocaleString()：完整的本地时间。
Date.prototype.toLocaleDateString()：本地日期（不含小时、分和秒）。
Date.prototype.toLocaleTimeString()：本地时间（不含年月日）

new Date().toLocaleTimeString() // "下午12:26:15"
new Date().toLocaleDateString() // "2020/10/18"
new Date().toLocaleString() // "2020/10/18 下午12:26:24"

这三个方法都有两个可选的参数

new Date().toLocaleString([locales[, options]])
new Date().toLocaleDateString([locales[, options]])
new Date().toLocaleTimeString([locales[, options]])

这两个参数中，locales是一个指定所用语言的字符串，options是一个配置对象

如何使用

我是在Vue环境中使用的

显示日期

<p>{{formatDate('2020/10/18')}}</p>

结果: 2020年10月18日

formatDate(date) {
     const options = { year: 'numeric', month: 'long', day: 'numeric' }
     return new Date(date).toLocaleDateString('zh-CN', options)
}

显示星期

<p>{{formatDate('2020/10/18')}}</p>

结果: 2020年10月18日星期日

formatDate(date) {
     const options = {  weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }
     return new Date(date).toLocaleDateString('zh-CN', options)
}

不同地区语言

<p>{{formatDate('2020/10/18')}}</p>

结果: Sunday, October 18, 2020

formatDate(date) {
     const options = {  weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }
     return new Date(date).toLocaleDateString('en-US', options)
}

参数`options`

dateStyle：可能的值为full、long、medium、short。
timeStyle：可能的值为full、long、medium、short。
month：可能的值为numeric、2-digit、long、short、narrow。
year：可能的值为numeric、2-digit。
weekday：可能的值为long、short、narrow。
day、hour、minute、second：可能的值为numeric、2-digit。
timeZone：可能的值为 IANA 的时区数据库。
timeZooneName：可能的值为long、short。
hour12：24小时周期还是12小时周期，可能的值为true、false

列子

new Date().toLocaleDateString('zh-CN', {
  weekday: 'long',
  year: 'numeric',
  month: 'long',
  day: 'numeric'
})
// "2020年10月18日星期日"

new Date().toLocaleTimeString('zh-CN', {
  timeZone: 'Asia/Shanghai',  
  hour12: false,
  timeZoneName: 'long'
})
// "中国标准时间 12:20:18"

new Date().toLocaleTimeString('zh-CN', {
  timeZone: 'Asia/Shanghai',  
  hour12: true,
  day: 'numeric'
})
// "18日 下午12:21:29"

扩展一下

分割

在Number的原型上也有这个方法toLocaleString,即 Number.prototype.toLocaleString()

const price = 12345678;
price.toLocaleString(); // => "12,345,678"

显示不同单位

currency 单位列表，查看

var price = 2499;
price.toLocaleString('zh-CN', {
  style: 'currency',
  currency: 'RMB'
});
// "RMB 2,499.00"

var price = 2499;
price.toLocaleString('zh-CN', {
  style: 'currency',
  currency: 'USD'
});
// "US$2,499.00"

控制小数位

var price = 2499;
price.toLocaleString('zh-CN', {
  style: 'currency',
  currency: 'KNS',
  minimumFractionDigits:3
});
// "KNS 2,499.000"

标签：18,toLocalDateString,long,用途,Date,new,options,numeric
来源： https://www.cnblogs.com/7c89/p/14938724.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9