JavaScript日期格式化及解析

JavaScript日期格式化及解析JavaScript开发经常需要对日期进行转换,把日期转成字符串或者从字符串生成日期。JavaScript日期对象内置了简单的日期格式化方法toString()和日期解析方法Date.parse(),这两个方法有较大的局限性,不能自定义自定义日期格式化和解析的字符串格式。下面列出一些常用的日期处理JS库。

大家好,又见面了,我是你们的朋友全栈君。

JavaScript开发经常需要对日期进行转换,把日期转成字符串或者从字符串生成日期。JavaScript日期对象内置了简单的日期格式化方法toString()和日期解析方法Date.parse(),这两个方法有较大的局限性,不能自定义自定义日期格式化和解析的字符串格式。下面列出一些常用的日期处理JS库。

名称 描述
Xdate XDate对Javascirpt本地Date对象进行了轻度包装,它提供对日期解析、格式化以及其他操作的加强功能,实现了本地Date对象的相同方法。
https://github.com/arshaw/xdate
Moment.js Moment.js是一个简单易用的轻量级JavaScript日期处理类库,提供了日期格式化、日期解析等功能。
https://github.com/moment/moment
Date.js Date.js是一个开源的JavaScript日期库,用来解析、格式化和处理日期数据,支持多种语言的日期格式处理。Date.js官网已经不再更新,在github可以找到维护版
https://github.com/abritinthebay/datejs

以上JS日期库都提供了日期解析和格式化的功能,如果仅仅对日期实现格式化和解析,下面提供更轻量级的方法。

/** * 日期格式化和解析 * DateUtils提供format和parse进行日期转换。 * format(date, pattern)把日期格式化成字符串。 * 使用方法: * var date = new Date(); * DateUtils.format(date, 'yyyy-MM-dd HH:mm:ss'); //2015-08-12 13:00:00 * * parse(str, pattern)把字符串转成日期。 * 使用方法: * var str = 2015-08-12 13:00:00; * DateUtils.format(str, 'yyyy-MM-dd HH:mm:ss'); * * parse有两个参数,如果只传递str参数,会调用浏览器内置的Date.parse()方法进行转换。 * * 格式 描述 * -------- --------------------------------------------------------------- * yy 年份后两位,如2015取后两位是15。 * yyyy 年份四位。 * M 月份,取值1 ~ 12。 * MM 月份,取值01 ~ 12,如果月份为个位数,前面补0。 * MMM 月份缩写,如一月的英文缩写为Jan,中文缩写为一。 * MMMM 月份全称,如January、一月。 * d 日期在月中的第几天,取值1~31。 * dd 日期在月中的第几天,取值01~31,如果天数为个位数,前面补0。 * ddd 星期缩写,取值日、一、二、三、四、五、六。 * dddd 星期全称,取值星期日、星期一、星期二、星期三、星期四、星期五、星期六。 * H 24小时进制,取值0~23。 * HH 24小时进制,取值00~23,如果小时为个位数,前面补0。 * h 12小时进制,取值0~11。 * hh 12小时进制,取值00~11,如果小时为个位数,前面补0。 * m 分钟,取值0~59。 * mm 分钟,取值00~59,如果为个位数,前面补0。 * s 秒,取值0~59。 * ss 秒,取值00~59,如果为个位数,前面补0。 * S 毫秒,取值0~999。 * SS 毫秒,取值00~999,如果不足两位数,前面补0。 * SSS 毫秒,取值000~999,如果不足三位数,前面补0。 * t 上午、下午缩写。 * tt 上午、下午全称。 * -------- --------------------------------------------------------------- * * @author accountwcx@qq.com * @date 2015-08-12 */
DateUtils = (function(){ 

/* var locale = { dayNames: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], shortDayNames: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], monthNames: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], shortMonthNames: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], am: 'AM', pm: 'PM', shortAm: 'A', shortPm: 'P' }; */
var locale = {
dayNames: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
shortDayNames: ["日", "一", "二", "三", "四", "五", "六"],
monthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
shortMonthNames: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二"],
am: "上午",
pm: "下午",
shortAm: '上',
shortPm: '下'
};
/** * 左边补0 */
function leftPad(str, size){ 

var result = '' + str;
while (result.length < size) {
result = '0' + result;
}
return result;
}
var parseToken = (function(){ 

var match2 = /\d{2}/,          // 00 - 99
//match3 = /\d{3}/, // 000 - 999
match4 = /\d{4}/,          // 0000 - 9999
match1to2 = /\d{1,2}/,     // 0 - 99
match1to3 = /\d{1,3}/,     // 0 - 999
//match1to4 = /\d{1,4}/, // 0 - 9999
match2w = /.{2}/,         // 匹配两个字符
match1wto2w = /.{1,2}/,   // 匹配1~2个字符
map = {
//年的后两位
'yy': {
regex: match2,
name: 'year'
},
//年
'yyyy': {
regex: match4,
name: 'year'
},
//两位数的月,不到两位数则补0
'MM': {
regex: match2,
name: 'month'
},
//月
'M': {
regex: match1to2,
name: 'month'
},
//两位数的日期,不到两位数则补0
'dd': {
regex: match2,
name: 'date'
},
//日期
'd': {
regex: match1to2,
name: 'date'
},
//两位数的小时,24小时进制
'HH': {
regex: match2,
name: 'hours'
},
//小时,24小时进制
'H': {
regex: match1to2,
name: 'hours'
},
//两位数的小时,12小时进制
'hh': {
regex: match2,
name: 'hours'
},
//小时,12小时进制
'h': {
regex: match1to2,
name: 'hours'
},
//两位数的分钟
'mm': {
regex: match2,
name: 'minutes'
},
//分钟
'm': {
regex: match1to2,
name: 'minutes'
},
's': {
regex: match1to2,
name: 'seconds'
},
'ss': {
regex: match2,
name: 'seconds'
},
//上午、下午
'tt': {
regex: match2w,
name: 't'
},
//上午、下午
't': {
regex: match1wto2w,
name: 't'
},
//毫秒
'S': {
regex: match1to3,
name: 'millisecond'
},
//毫秒
'SS': {
regex: match1to3,
name: 'millisecond'
},
//毫秒
'SSS': {
regex: match1to3,
name: 'millisecond'
}
};
return function(token, str, dateObj){ 

var result, part = map[token];
if(part){
result = str.match(part.regex);
if(result){
dateObj[part.name] = result[0];
return result[0];
}
}
return null;
};
})();
return {
locale: locale,
format: function(val, pattern){ 

if(Object.prototype.toString.call(val) !== '[object Date]'){
return '';
}
if(Object.prototype.toString.call(pattern) !== '[object String]' || pattern === ''){
pattern = 'yyyy-MM-dd HH:mm:ss';
}
var fullYear = val.getFullYear(),
month = val.getMonth(),
day = val.getDay(),
date = val.getDate(),
hours = val.getHours(),
minutes = val.getMinutes(),
seconds = val.getSeconds(),
milliseconds = val.getMilliseconds();
return pattern.replace(/(\\)?(dd?d?d?|MM?M?M?|yy?y?y?|hh?|HH?|mm?|ss?|tt?|SS?S?)/g, function (m) { 

if (m.charAt(0) === '\\') {
return m.replace('\\', '');
}
var locale = DateUtils.locale;
switch (m) {
case "hh":
return leftPad(hours < 13 ? (hours === 0 ? 12 : hours) : (hours - 12), 2);
case "h":
return hours < 13 ? (hours === 0 ? 12 : hours) : (hours - 12);
case "HH":
return leftPad(hours, 2);
case "H":
return hours;
case "mm":
return leftPad(minutes, 2);
case "m":
return minutes;
case "ss":
return leftPad(seconds, 2);
case "s":
return seconds;
case "yyyy":
return fullYear;
case "yy":
return (fullYear + '').substring(2);
case "dddd":
return locale.dayNames[day];
case "ddd":
return locale.shortDayNames[day];
case "dd":
return leftPad(date, 2);
case "d":
return date;
case "MMMM":
return locale.monthNames[month];
case "MMM":
return locale.shortMonthNames[month];
case "MM":
return leftPad(month + 1, 2);
case "M":
return month + 1;
case "t":
return hours < 12 ? locale.shortAm : locale.shortPm;
case "tt":
return hours < 12 ? locale.am : locale.pm;
case "S":
return milliseconds;
case "SS":
return leftPad(milliseconds, 2);
case "SSS":
return leftPad(milliseconds, 3);
default: 
return m;
}
});
},
parse: function(val, pattern){ 

if(!val){
return null;
}
if(Object.prototype.toString.call(val) === '[object Date]'){
// 如果val是日期,则返回。
return val;
}
if(Object.prototype.toString.call(val) !== '[object String]'){
// 如果val不是字符串,则退出。
return null;
}
var time;
if(Object.prototype.toString.call(pattern) !== '[object String]' || pattern === ''){
// 如果fmt不是字符串或者是空字符串。
// 使用浏览器内置的日期解析
time = Date.parse(val);
if(isNaN(time)){
return null;
}
return new Date(time);
}
var i, token, tmpVal, 
tokens = pattern.match(/(\\)?(dd?|MM?|yy?y?y?|hh?|HH?|mm?|ss?|tt?|SS?S?|.)/g),
dateObj = {
year: 0,
month: 1,
date: 0,
hours: 0,
minutes: 0,
seconds: 0,
millisecond: 0
};
for(i = 0; i < tokens.length; i++){
token = tokens[i];
tmpVal = parseToken(token, val, dateObj);
if(tmpVal !== null){
if(val.length > tmpVal.length){
val = val.substring(tmpVal.length);
}else{
val = '';
}
}else{
val = val.substring(token.length);
}
}
if(dateObj.t){
if(DateUtils.locale.pm === dateObj.t || DateUtils.locale.shortPm === dateObj.t){
dateObj.hours = (+dateObj.hours) + 12;
}
}
dateObj.month -= 1;
return new Date(dateObj.year, dateObj.month, dateObj.date, dateObj.hours, dateObj.minutes, dateObj.seconds, dateObj.millisecond);
}
};
})();
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/141684.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • java全局变量和静态变量的区别_java局部静态变量

    java全局变量和静态变量的区别_java局部静态变量全局变量和局部变量的简介:1、全局变量:描述对象有什么(在类中定义),类中所有方法都可以使用。2、局部变量:临时保存数据(在类的方法中定义),只能在当前方法中使用。全局变量和局部变量的区别:1、作用域不同全局变量=整个类中可用局部变量=该方法内可用2、初始值不同全局变量=有初始值局部变量=无初始值3、声明上不同全局变量=在一个类中不允许声明同名变量局部变量=在一个方…

  • winexec for linux[通俗易懂]

    winexec for linux[通俗易懂]ViewFullVersion:[allvariants]psexecforLinuxpromodusAugust25th,2008,04:42AMAftersometrial&errorI’vegottenwinexectoworkonLinux.Thisisidenticaltothepse

  • let暂时性死区理解「建议收藏」

    let暂时性死区理解「建议收藏」Let中提到的暂时性死区到底是什么,它的产生原因是? ES6规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”,也就是说使用let声明的变量都是先声明再使用,不存在变量提升问题。letmyname=’sxx’;{console.log(myname);l…

  • 目标检测使用LabelImg标注VOC数据格式和YOLO数据格式——LabelImg使用详细教程

    目标检测使用LabelImg标注VOC数据格式和YOLO数据格式——LabelImg使用详细教程欢迎大家关注笔者,你的关注是我持续更博的最大动力原创文章,转载告知,盗版必究@[toc](目标检测使用LabelImg标注VOC数据格式和YOLO数据格式——LabelImg使用详细教程文章目录:)1LabelImg介绍与安装1.1Label介绍github是目标检测数据标注工具,可以标注标注两种格式:VOC标签格式,标注的标签存储在xml文件YOLO标签格式,标注的标签存储在txt文件中LabelImg的github主页地址:点我,带你去>https://…

  • 验证码的作用及原理

    验证码的作用及原理验证码的发展历程从互联网诞生前期,互联网是没有验证码的。在论坛博客上发帖子,只要敲一下回车键按“发表”就可以了。然而,有白客就有黑客,随着计算机程序的愈发发展,黑客十分猖狂。他们编写了一种能够大量、重复编写信息的程序,伪装成人类用户,肆无忌惮的在网络上倾倒大量的、无意义的“僵尸”信息,垃圾邮件、垃圾广告、垃圾评论到处飞。更编写了模仿登录、恶意激活成功教程代码、刷票等恶意程序。这严重影响了互联网的正常运行,导致体验效果很差。以受影响最大的电子邮件的提供商为例:用户每天收到数以千计的垃圾邮件,严重影响工作效率。.

  • 深入浅出MFC—Frame1[通俗易懂]

    深入浅出MFC—Frame1[通俗易懂]#includeclassCObject{public: CObject() { printf(“CObjectConstructor\n”); } ~CObject() { printf(“CObjectDestructor\n”); }};classCCmdTarget:publicCObject{publ

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号