本文汇总了JavaScript中实现时间日期格式化的四种常见方法。从基础的字符串拼接，到处理小于10时前置补0的改进版，再到利用数组映射简化逻辑，最后介绍支持自定义模板字符串的高级方案。通过逐步优化的代码示例，帮助开发者根据实际需求选择最合适的时间格式化方案，提升前端开发效率。
JavaScript时间格式化概述
在实际开发中，我们常常需要将时间对象转换为特定格式的字符串，例如“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;
}
输出结果：
前置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[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日”这种格式，之前的代码就需要大量修改。为了灵活应对不同格式需求，我们可以编写一个结构更完善的通用函数。
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实现时间日期的格式化内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站！