javascript实现时间日期的格式化的方法汇总


Posted in Javascript onAugust 06, 2020

有的时候,我们需要一定格式的 时间 比如 2017-05-12 08:48 这样的格式。
上代码先

时间格式化

第一种

function formatDate(time){
	var date = new Date(time);

	var year = date.getFullYear(),
		month = date.getMonth() + 1,//月份是从0开始的
		day = date.getDate(),
		hour = date.getHours(),
		min = date.getMinutes(),
		sec = date.getSeconds();
	var newTime = year + '-' +
				month + '-' +
				day + ' ' +
				hour + ':' +
				min + ':' +
				sec;
	return newTime;			
}

输出结果:

javascript实现时间日期的格式化的方法汇总

前置0

但是这里存在一个问题,就是,我想要的格式应该是 2017-05-12 08:49:25 在月、日、时、分、秒 小于10的时候,应该要前置一个0。
改进代码:

第二种

function formatDate(time){
	var date = new Date(time);

	var year = date.getFullYear(),
		month = date.getMonth()+1,//月份是从0开始的
		day = date.getDate(),
		hour = date.getHours(),
		min = date.getMinutes(),
		sec = date.getSeconds();
	var newTime = year + '-' +
				(month < 10? '0' + month : month) + '-' +
				(day < 10? '0' + day : day) + ' ' +
				(hour < 10? '0' + hour : hour) + ':' +
				(min < 10? '0' + min : min) + ':' +
				(sec < 10? '0' + sec : sec);

	return newTime;			
}

formatDate(new Date().getTime());//2017-05-12 09:09:21

第三种

这下格式对了。但是会不会麻烦了点?我们再试试这种
一个长度为10 的数组:

var preArr = Array.apply(null,Array(10)).map(function(elem, index) {
		return '0'+index;
	});////开个长度为10的数组 格式为 ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09"]

在如果数字在preArr中则群preArr[i],否则 就本身的值,比如:preArr[month]||month。具体实现如下:

function formatDate(time){
	var date = new Date(time);

	var year = date.getFullYear(),
		month = date.getMonth()+1,//月份是从0开始的
		day = date.getDate(),
		hour = date.getHours(),
		min = date.getMinutes(),
		sec = date.getSeconds();
	var preArr = Array.apply(null,Array(10)).map(function(elem, index) {
		return '0'+index;
	});////开个长度为10的数组 格式为 00 01 02 03

	var newTime = year + '-' +
				(preArr[month]||month) + '-' +
				(preArr[day]||day) + ' ' +
				(preArr[hour]||hour) + ':' +
				(preArr[min]||min) + ':' +
				(preArr[sec]||sec);

	return newTime;			
}
formatDate(new Date().getTime());//2017-05-12 09:45:41

任意设置时间模式

第四种(推荐)

以上,都是按照固定的格式YY-MM-DD hh:mm:ss 输出的。要是产品突然说,改成2017年05月12这种格式,天啦撸,又要改o(?□?)o。那我还是写个结构好一些的吧,你们随便玩。

function formatDate(time,format='YY-MM-DD hh:mm:ss'){
	var date = new Date(time);

	var year = date.getFullYear(),
		month = date.getMonth()+1,//月份是从0开始的
		day = date.getDate(),
		hour = date.getHours(),
		min = date.getMinutes(),
		sec = date.getSeconds();
	var preArr = Array.apply(null,Array(10)).map(function(elem, index) {
		return '0'+index;
	});////开个长度为10的数组 格式为 00 01 02 03

	var newTime = format.replace(/YY/g,year)
						.replace(/MM/g,preArr[month]||month)
						.replace(/DD/g,preArr[day]||day)
						.replace(/hh/g,preArr[hour]||hour)
						.replace(/mm/g,preArr[min]||min)
						.replace(/ss/g,preArr[sec]||sec);

	return newTime;			
}
formatDate(new Date().getTime());//2017-05-12 10:05:44
formatDate(new Date().getTime(),'YY年MM月DD日');//2017年05月12日
formatDate(new Date().getTime(),'今天是YY/MM/DD hh:mm:ss');//今天是2017/05/12 10:07:45

大功告成!

参考链接:
JavaScript 怎么快速声明一个数组

到此这篇关于javascript实现时间日期的格式化的方法汇总的文章就介绍到这了,更多相关javascript实现时间日期的格式化内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
js继承 Base类的源码解析
Dec 30 Javascript
jquery里的正则表达式说明
Aug 03 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
Jan 24 Javascript
jquery改变tr背景色的示例代码
Dec 28 Javascript
使用jQuery Rotare实现微信大转盘抽奖功能
Jun 20 Javascript
把多个JavaScript函数绑定到onload事件处理函数上的方法
Sep 04 Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 Javascript
详解vue配置后台接口方式
Mar 29 Javascript
vue视图不更新情况详解
May 16 Javascript
ECharts地图绘制和钻取简易接口详解
Jul 12 Javascript
layui 富文本图片上传接口与普通按钮 文件上传接口的例子
Sep 23 Javascript
js实现弹幕飞机效果
Aug 27 Javascript
vue+ElementUI 关闭对话框清空验证,清除form表单的操作
Aug 06 #Javascript
javascript读取本地文件和目录方法详解
Aug 06 #Javascript
antd vue 刷新保留当前页面路由,保留选中菜单,保留menu选中操作
Aug 06 #Javascript
javascript实现页面的实时时钟显示示例
Aug 06 #Javascript
Javascript如何递归遍历本地文件夹
Aug 06 #Javascript
通过vue刷新左侧菜单栏操作
Aug 06 #Javascript
Vue页面手动刷新,实现导航栏激活项还原到初始状态
Aug 06 #Javascript
You might like
浅析php fwrite写入txt文件的时候用 \r\n不能换行的问题
2013/08/06 PHP
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
分享PHP守护进程类
2015/12/30 PHP
php写入txt乱码的解决方法
2019/09/17 PHP
自己实现string的substring方法 人民币小写转大写,数字反转,正则优化
2012/09/02 Javascript
JS验证身份证有效性示例
2013/10/11 Javascript
从零学习node.js之搭建http服务器(二)
2017/02/21 Javascript
浅谈JS中的常用选择器及属性、方法的调用
2017/07/28 Javascript
react build 后打包发布总结
2018/08/24 Javascript
vue上传图片到oss的方法示例(图片带有删除功能)
2018/09/27 Javascript
javascript function(函数类型)使用与注意事项小结
2019/06/10 Javascript
Node.js使用MongoDB的ObjectId作为查询条件的方法
2019/09/10 Javascript
[02:23]2018DOTA2亚洲邀请赛趣味视频——反应测试
2018/04/04 DOTA
Python中datetime模块参考手册
2017/01/13 Python
Python下的Softmax回归函数的实现方法(推荐)
2017/01/26 Python
Python实现的文本简单可逆加密算法示例
2017/05/18 Python
对numpy中shape的深入理解
2018/06/15 Python
python实现批量解析邮件并下载附件
2018/06/19 Python
使用Scrapy爬取动态数据
2018/10/21 Python
Python实现 版本号对比功能的实例代码
2019/04/18 Python
python自制包并用pip免提交到pypi仅安装到本机【推荐】
2019/06/03 Python
Python class的继承方法代码实例
2020/02/14 Python
python中安装django模块的方法
2020/03/12 Python
CSS3打造百度贴吧的3D翻牌效果示例
2017/01/04 HTML / CSS
洛杉矶时尚女装系列:J.ING US
2019/03/17 全球购物
世界上最大的冷却器制造商:Igloo Coolers
2019/07/23 全球购物
德国50岁以上交友网站:Lebensfreunde
2020/03/18 全球购物
汽车专业人才自我鉴定范文
2013/12/29 职场文书
宠物店的创业计划书范文
2014/01/11 职场文书
上班玩手机检讨书
2014/02/17 职场文书
投标承诺书怎么写
2014/05/24 职场文书
小班教师个人总结
2015/02/05 职场文书
财务人员个人工作总结
2015/02/27 职场文书
雷锋之歌观后感
2015/06/10 职场文书
互联网的下一个风口:新的独角兽将诞生
2019/08/02 职场文书
Oracle表空间与权限的深入讲解
2021/11/17 Oracle