js时间日期格式化封装函数


Posted in Javascript onDecember 02, 2014

js虽然提供了各种获取时间Date对象的不同属性方法,如:getDate 方法 | getDay 方法 | getFullYear 方法 | getHours 方法 ... ... 等等,但是却没有像java那样提供一个方法来供用户来根据自身提供的模板(pattern),来格式化指定时间对象,所以自己就封装了一个小方法,只供大家闲来调侃-.-,有好的建议还望慷慨指荐哦。

用到知识点:

 arguments:该对象代表正在执行的函数和调用它的函数的参数。不可显式创建,虽然有length属性,且能像数组一样以“[]”语法方式取值,但它并不是一个数组。 typeof object :运算符,返回一个用来表示表达式的数据类型的字符串。六种可能: "number," "string," "boolean," "object," "function," 和 "undefined."。 object.constructor:表示创建对象的函数。object必须是对象或函数的名称。基础数据没有该属性。 exec 方法:用正则表达式模式在字符串中运行查找,并返回包含该查找结果的一个数组。没有找到匹配,则它返回 null。数组中同类型匹配元素不会重复出现。 str.split(Rex|str):以一个正则对象或子字符串,将一个字符串分割为子字符串,然后将结果作为字符串数组返回。 throw Error('msg'):抛出一个带有Message信息的Error。throw 后面可跟任何表达式。 还有一些for..in用法,三目运算符,substr这些就不讲了,比较简单。

代码片段:

/**

 * ***js时间日期格式化*** <br>

 * <p>

 * 模版字符串采用严谨格式,超出则会抛出异常,且每类格式只可出现一次,如:yyyy-mm-yyyy 格式会抛异常

 * </p>

 * y-年    length: 2/4位 <br>

 * q-季度    length: 1位 <br>

 * M-月    length: 1~2位 <br>

 * d-日    length: 1~2位 <br>

 * H-时    length: 1~2位24小时制,h:12小时制 <br>

 * m-分    length: 1~2位 <br>

 * s-秒    length: 1~2位 <br>

 * S-毫秒 length: 固定1位

 * @param {Date类型对象} date

 * @param {String类型模板字符串} fmt

 * @return 格式化后时间日期字符串

 * @author lyt

 */

function DateFormat(date, fmt){

    if (arguments.length != 2) // 参数个数校验

        throw Error('arguments长度不合法');

    if (!date || (typeof date != 'object') || (d.constructor != Date)) // 参数合法性校验

        throw Error(arguments[0] + ':类型不为Date类型');

    if (/H+/.test(fmt) && /h+/.test(fmt))

        throw Error("小时格式错误,同类型只能连续出现一次!");

    /* 模板参数校验,正则验证方法 */

    var verify = function(Rex ){

        var arr = new RegExp(Rex).exec(fmt); // 获得匹配结果数组

        if (!arr) // 匹配失败返回

            return "";

        if (fmt.split(Rex).length > 2)  // 同一类型间隔出现多次

            throw Error("fmt格式错误:同类型只能连续出现一次!");

        return arr[0];

    };

    /**

     * 提供月、天、时、分、秒通用匹配替换

     * @param {对象o属性key} r

     * @param {r对应正则对象} rex

     **/

    var common = function(r, rex) {

        if(len !=1 && len !=2)

            throw Error("月份格式错误:M只能出现1/2次");

        len == 2 ? fmt=fmt.replace(rex, o[r].length==1 ? "0"+o[r] : o[r]) : fmt=fmt.replace(rex, o[r]);

    }

    var o = { // 数据存储对象

        "y+": date.getFullYear() + "", // 年

        "q+": Math.floor((date.getMonth() + 3) / 3), // 季度

        "M+": date.getMonth() + 1 + "", // 月

        "d+": date.getDate() + "", // 日

        "H+": date.getHours() + "", // 24时

        "h+": date.getHours() + "", // 12时

        "m+": date.getMinutes() + "", // 分

        "s+": date.getSeconds() + "", // 秒

        "S+": date.getMilliseconds() // 毫秒

    }

    for(var r in o) {

        var rex, len, temp;

        rex = new RegExp(r);

        temp = verify(rex); // 匹配所得字符串

        len = temp.length; // 长度

        if(!len || len == 0) 

            continue;

        if(r == "y+") { 

            if(len !=2 && len != 4)

                throw Error("年份格式错误:y只能出现2/4次");

            len == 2 ? fmt=fmt.replace(rex, o[r].substr(2,3)) : fmt=fmt.replace(rex, o[r]);

        } else if(r == "q+") {

            if(len != 1)

                throw Error("季度格式错误:q只能出现1次");

            fmt=fmt.replace(rex, o[r]);

        } else if(r == "h+") {

            if(len !=1 && len !=2)

                throw Error("小时格式错误:h只能出现1/2次");

            var h = (o[r] > 12 ? o[r]-12 : o[r]) + "";

            len == 2 ? fmt=fmt.replace(rex, h.length==1 ? "0"+h : h) : fmt=fmt.replace(rex, h);

        }  else if(r == "S+") {

            if(len != 1) 

                throw Error("毫秒数格式错误:S只能出现1次");

            fmt=fmt.replace(rex, o[r]);

        }else {    // (r=="M+" || r=="d+" || r=="H+" || r=="m+" || r=="s+")

            common(r, rex)

        }  

    }

    return fmt;

}

上几个演示效果,供大家参考:

console.log(DateFormat(new Date(),'yyyy年第q季度M月dd日HH时m分s秒S毫秒'));

js时间日期格式化封装函数

console.log(DateFormat(new Date(),'yyyy年yy第q季度M月dd日HH时m分s秒S毫秒'));

js时间日期格式化封装函数

console.log(DateFormat(new Date(),'yyyy年第q季度M月dd日Hh时m分s秒S毫秒'));

js时间日期格式化封装函数

console.log(DateFormat("我不是时间对象",'yyyy年第q季度M月dd日Hh时m分s秒S毫秒'));

js时间日期格式化封装函数

console.log(DateFormat(new Date(),'yyyy年第q季度MMM月dd日HH时m分s秒S毫秒'));

js时间日期格式化封装函数

其他效果就不一一列举了,感兴趣的可以把代码拷贝下来直接测试就行了,有任何BUG或者有待优化的地方请慷慨指正哦。

以上便是这款非常好用的封装函数的介绍了,是不是很实用呢,小伙伴们可以直接使用到自己的项目中。

Javascript 相关文章推荐
用jscript实现列出安装的软件列表
Jun 18 Javascript
Ext JS Grid在IE6 下宽度的问题解决方法
Feb 15 Javascript
js替代copy(示例代码)
Nov 27 Javascript
jquery实现input输入框实时输入触发事件代码
Jan 28 Javascript
jquery实现鼠标滑过显示二级下拉菜单效果
Aug 24 Javascript
javascript实现html页面之间参数传递的四种方法实例分析
Dec 15 Javascript
js canvas仿支付宝芝麻信用分仪表盘
Nov 16 Javascript
jquery仿京东侧边栏导航效果
Mar 02 Javascript
用npm-run实现自动化任务的方法示例
Jan 14 Javascript
Node.js使用supervisor进行开发中调试的方法
Mar 26 Javascript
使用js实现一个简单的滚动条过程解析
Sep 10 Javascript
vue实现分页加载效果
Dec 24 Javascript
JavaScript基础语法、dom操作树及document对象
Dec 02 #Javascript
JavaScript基础知识学习笔记
Dec 02 #Javascript
Js 正则表达式知识汇总
Dec 02 #Javascript
21个JavaScript事件(Events)属性汇总
Dec 02 #Javascript
bootstrap改变按钮加载状态
Dec 01 #Javascript
使用ajax+jqtransform实现动态加载select
Dec 01 #Javascript
Javascript字符串浏览器兼容问题分析
Dec 01 #Javascript
You might like
详解PHP显示MySQL数据的三种方法
2008/06/05 PHP
PHP导出EXCEL快速开发指南--PHPEXCEL的使用详解
2013/06/03 PHP
PHP实现简单的模板引擎功能示例
2017/09/02 PHP
不要在cookie中使用特殊字符的原因分析
2010/07/13 Javascript
五段实用的js高级技巧
2011/12/20 Javascript
javascript监听鼠标滚轮事件浅析
2014/06/05 Javascript
基于jQuery实现的文字按钮表单特效整理
2014/12/07 Javascript
jqueryUI里拖拽排序示例分析
2015/02/26 Javascript
JS简单模拟触发按钮点击功能的方法
2015/11/30 Javascript
移动端jQuery修正Web页面滑动时div问题的两则实例
2016/05/30 Javascript
js制作网站首页图片轮播特效代码
2016/08/30 Javascript
jquery中绑定事件的异同
2017/02/28 Javascript
PM2自动部署代码步骤流程总结
2018/12/10 Javascript
vue实现微信获取用户信息的方法
2019/03/21 Javascript
微信小程序封装自定义弹窗的实现代码
2019/05/08 Javascript
jQuery实现checkbox全选、反选及删除等操作的方法详解
2019/08/02 jQuery
js实现鼠标点击页面弹出自定义文字效果
2019/12/24 Javascript
JS如何生成随机验证码
2020/03/02 Javascript
Vue如何实现监听组件原生事件
2020/07/03 Javascript
[02:43]2014DOTA2国际邀请赛 官方Alliance战队纪录片
2014/07/14 DOTA
推荐11个实用Python库
2015/01/23 Python
Pytorch Tensor的统计属性实例讲解
2019/12/30 Python
django admin管理工具自定义时间区间筛选器DateRangeFilter介绍
2020/05/19 Python
深入了解NumPy 高级索引
2020/07/24 Python
基于python爬取梨视频实现过程解析
2020/11/09 Python
Python批量删除mysql中千万级大量数据的脚本分享
2020/12/03 Python
美国现代家具和家居商店:Apt2B
2016/08/29 全球购物
Marriott国际:万豪国际酒店查询预订
2017/09/25 全球购物
Zooplus罗马尼亚:宠物食品和配件
2019/11/02 全球购物
《台湾的蝴蝶谷》教学反思
2014/02/20 职场文书
银行办公室岗位职责
2014/03/10 职场文书
《冬阳童年骆驼队》教学反思
2014/04/15 职场文书
消防安全宣传标语
2014/06/07 职场文书
新婚姻法离婚协议书范文
2014/11/30 职场文书
教你怎么用PyCharm为同一服务器配置多个python解释器
2021/05/31 Python
Nginx使用Lua模块实现WAF的原理解析
2021/09/04 Servers