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 相关文章推荐
jquery插件制作教程 txtHover
Aug 17 Javascript
jquery实现控制表格行高亮实例
Jun 05 Javascript
form表单只提交数据而不进行页面跳转的解决方案
Sep 18 Javascript
解决JQeury显示内容没有边距内容紧挨着浏览器边线
Dec 20 Javascript
node.js实现博客小爬虫的实例代码
Oct 08 Javascript
JS实现的简单轮播图运动效果示例
Dec 22 Javascript
Node.js使用NodeMailer发送邮件实例代码
Mar 06 Javascript
从零开始学习Node.js系列教程六:EventEmitter发送和接收事件的方法示例
Apr 13 Javascript
详谈Angular 2+ 的表单(一)之模板驱动型表单
Apr 25 Javascript
基于JavaScript实现幸运抽奖页面
Jul 05 Javascript
JS实现字符串去重及数组去重的方法示例
Apr 21 Javascript
vue实现输入一位数字转汉字功能
Dec 13 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的数组与字符串的转换函数整理汇总
2013/07/18 PHP
php使用curl检测网页是否被百度收录的示例分享
2014/01/31 PHP
PHP Socket网络操作类定义与用法示例
2017/08/30 PHP
javascript 学习之旅 (2)
2009/02/05 Javascript
jquery下json数组的操作实现代码
2010/08/09 Javascript
ActiveX控件与Javascript之间的交互示例
2014/06/04 Javascript
用队列模拟jquery的动画算法实例
2015/01/20 Javascript
SuperSlide标签切换、焦点图多种组合插件
2015/03/14 Javascript
详解AngularJS中自定义指令的使用
2015/06/17 Javascript
老生常谈 js中this的指向
2016/06/30 Javascript
jQuery遍历DOM的父级元素、子级元素和同级元素的方法总结
2016/07/07 Javascript
vue.js的双向数据绑定Object.defineProperty方法的神奇之处
2019/01/18 Javascript
Vue数据绑定简析小结
2019/05/07 Javascript
javascript关于“时间”的一次探索
2019/07/24 Javascript
Python3.x版本中新的字符串格式化方法
2015/04/24 Python
编写Python脚本使得web页面上的代码高亮显示
2015/04/24 Python
Swift中的协议(protocol)学习教程
2016/07/08 Python
Python中的连接符(+、+=)示例详解
2017/01/13 Python
使用Python &amp; Flask 实现RESTful Web API的实例
2017/09/19 Python
python中map()函数的使用方法示例
2017/09/29 Python
python实现图片文件批量重命名
2020/03/23 Python
Python判断字符串是否xx开始或结尾的示例
2019/08/08 Python
Django结合ajax进行页面实时更新的例子
2019/08/12 Python
python3通过udp实现组播数据的发送和接收操作
2020/05/05 Python
python的help函数如何使用
2020/06/11 Python
python之openpyxl模块的安装和基本用法(excel管理)
2021/02/03 Python
css3 实现滚动条美化效果的实例代码
2021/01/06 HTML / CSS
html5借用repeating-linear-gradient实现一把刻度尺(ruler)
2019/09/09 HTML / CSS
迪卡侬荷兰官网:Decathlon荷兰
2017/10/29 全球购物
韩国美国时尚服装和美容在线全球市场:KOODING
2018/11/07 全球购物
高中毕业生自我鉴定范文
2013/09/26 职场文书
幼儿园长自我鉴定
2013/10/17 职场文书
毕业生自我推荐
2013/11/04 职场文书
公务员综合考察材料
2014/02/01 职场文书
研究生毕业自我鉴定范文
2014/03/27 职场文书
党支部工作总结2015
2015/04/01 职场文书