JavaScript中时间格式化新思路toLocaleString()


Posted in Javascript onNovember 07, 2021

研究Object对象的时候,看到了 toLocaleString() 这个方法可以很简单的实现时间格式化。

1、时间格式化常规思路

正常思路是通过Date的实例依次获取年月日等,例如一个简单的格式化例子:

Date.prototype.format = function(dateStr) {
    let date = new Date();
    let year = date.getFullYear();
    let month = date.getMonth() + 1;
    let day = date.getDate().toString().padStart(2, "0");
    let hour = date.getHours();
    let minute = date.getMinutes();
    let second = date.getSeconds();
    dateStr = dateStr.replace("年", year)
        .replace("月", month)
        .replace("日", day)
        .replace("小时", hour)
        .replace("分钟", minute)
        .replace("秒", second);
    return dateStr;
};
 
// 使用上面的方法
console.log(new Date().format("年-月-日")); // 2021-11-04

2、时间格式化toLocaleString()

toLocaleString() toString() 类似,也是返回对象的字符串,不过会根据本地化的执行环境处理。尤其是对时间对象的支持,可以转成一定的格式。

// 日期,输出当前时间
let date = new Date();
// 这个是格林威治时间格式
console.log(date.toString()); // Thu Nov 04 2021 10:11:35 GMT+0800 (中国标准时间)
// 这个是本地时间格式
console.log(date.toLocaleString()); // 2021/11/4 上午10:18:08

新版本浏览器可以支持 locales 和 options 参数:

let date = new Date();
// 24小时制
let options = {
    year: 'numeric', month: 'numeric', day: 'numeric',
    hour: 'numeric', minute: 'numeric', second: 'numeric',
    hour12: false
};
console.log(date.toLocaleString("zh-CN", options)); // 2021/11/4 10:33:01

获取星期几:

let date = new Date();
let options = {
    weekday: "long"
};
console.log(date.toLocaleString("zh-CN", options)); // 星期四

options 更多的参数可以参考文章尾部提供的链接。

缺陷:

如果要显示 x年x月x日 这样的格式,目前没有找合适的写法,相对来讲 toLocaleString() 功能比较局限一些。

到此这篇关于JavaScript中时间格式化新思路toLocaleString()的文章就介绍到这了,更多相关JavaScript toLocaleString()内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript高级程序设计 读书笔记之十 本地对象Date日期
Feb 27 Javascript
Jquery实现网页跳转或用命令打开指定网页的解决方法
Jul 09 Javascript
DOM基础教程之使用DOM + Css
Jan 20 Javascript
谈谈JavaScript类型系统之Math
Jan 06 Javascript
Bootstrap3.0学习教程之JS折叠插件
May 27 Javascript
jQuery dataTables与jQuery UI 对话框dialog的使用教程
Sep 02 Javascript
利用jQuery插件imgAreaSelect实现图片上传裁剪(放大缩小)
Dec 02 Javascript
javascript编写简易计算器
May 06 Javascript
详解webpack分包及异步加载套路
Jun 29 Javascript
js+html5生成自动排列对话框实例
Oct 09 Javascript
vue购物车插件编写代码
Nov 27 Javascript
React服务端渲染原理解析与实践
Mar 04 Javascript
JavaScript中isPrototypeOf函数
JavaScript原型链详解
JavaScript组合继承详解
详细聊聊vue中组件的props属性
教你一步步实现一个简易promise
Nov 02 #Javascript
一定要知道的 25 个 Vue 技巧
原型和原型链 prototype和proto的区别详情
Nov 02 #Javascript
You might like
使用PHP socke 向指定页面提交数据
2008/07/23 PHP
thinkphp中html:list标签传递多个参数实例
2014/10/30 PHP
PHP的APC模块实现上传进度条
2015/10/27 PHP
Symfony2实现在controller中获取url的方法
2016/03/18 PHP
解决php 处理 form 表单提交多个 name 属性值相同的 input 标签问题
2017/05/11 PHP
Mootools 1.2教程 滑动效果(Slide)
2009/09/15 Javascript
IE6 弹出Iframe层中的文本框“经常”无法获得输入焦点
2009/12/27 Javascript
jquery中dom操作和事件的实例学习 下拉框应用
2011/12/01 Javascript
JS 实现点击a标签的时候让其背景更换
2013/10/15 Javascript
超棒的响应式布局jQuery插件Freetile.js
2014/11/17 Javascript
AngularJS基础知识
2014/12/21 Javascript
Nodejs Express4.x开发框架随手笔记
2015/11/23 NodeJs
BootStrap实现手机端轮播图左右滑动事件
2016/10/13 Javascript
javascript基础练习之翻转字符串与回文
2017/02/20 Javascript
vue + socket.io实现一个简易聊天室示例代码
2017/03/06 Javascript
解决Vue2.0 watch对象属性变化监听不到的问题
2018/09/11 Javascript
微信jssdk逻辑在vue中的运用详解
2018/11/14 Javascript
JavaScript实现汉字转换为拼音及缩写的方法示例
2019/03/28 Javascript
Vue实现拖放排序功能的实例代码
2019/07/08 Javascript
[33:17]OG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python实现的简单dns查询功能示例
2017/05/24 Python
python的socket编程入门
2018/01/29 Python
python将txt文件读入为np.array的方法
2018/10/30 Python
pyqt5 QlistView列表显示的实现示例
2020/03/24 Python
详解Python中import机制
2020/09/11 Python
使用Python提取文本中含有特定字符串的方法示例
2020/12/09 Python
解决import tensorflow导致jupyter内核死亡的问题
2021/02/06 Python
SmartBuyGlasses英国:购买太阳镜和眼镜
2018/01/29 全球购物
伊莱克斯(Electrolux)俄罗斯网上商店:瑞典家用电器品牌
2021/01/23 全球购物
.NET面试题:什么是值类型和引用类型
2016/01/12 面试题
护理不良事件检讨书
2014/02/06 职场文书
公立医院改革实施方案
2014/03/14 职场文书
教师个人年度总结
2015/02/11 职场文书
2015年公司保安年终工作总结
2015/05/14 职场文书
使用python如何删除同一文件夹下相似的图片
2021/05/07 Python
table设置超出部分隐藏,鼠标移上去显示全部内容的方法
2022/12/24 HTML / CSS