javascript 封装Date日期类实例详解


Posted in Javascript onMay 28, 2017

javascript-封装Date日期类

(一)对日期进行格式化

自定义Date日期类的format()格式化方法

方式一:(非原创)

// 对Date的扩展,将 Date 转化为指定格式的String
// 月(M)、日(d)、小时(H)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符, 
// 年(y)可以用 1-4 个占位符,毫秒(S)只能用 1 个占位符(是 1-3 位的数字) 
// 例子: 
// (new Date()).Format("yyyy-MM-dd HH:mm:ss.S") ==> 2016-09-19 16:32:53.731
// (new Date()).Format("yyyy-M-d H:m:s:S")   ==> 2016-9-19 16:40:9:955 
Date.prototype.Format = function (fmt) { //author: meizz 
  var o = {
    "M+": this.getMonth() + 1, //月份 
    "d+": this.getDate(), //日 
    "H+": this.getHours(), //小时 
    "m+": this.getMinutes(), //分 
    "s+": this.getSeconds(), //秒 
    "q+": Math.floor((this.getMonth() + 3) / 3), //季度 
    "S": this.getMilliseconds() //毫秒 
  };
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
  for (var k in o)
  if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  return fmt;
};

测试:

window.onload=function() {
  var date = new Date();
  var b = date.toLocaleDateString();//获取的格式为:2016年9月19日
  var d = date.toLocaleTimeString();//下午4:42:46
  var e = date.toLocaleString();//2016年9月19日 下午4:44:02
  var f = date.toDateString();//Mon Sep 19 2016
  var g = date.toUTCString();//Mon, 19 Sep 2016 08:45:42 GMT
  var h = date.toString();//Mon Sep 19 2016 16:46:23 GMT+0800 (中国标准时间)
  //自定义日期格式
  var c = date.Format("yyyy-MM-dd HH:mm:ss");//format()方法是自定义的
  document.getElementById("aa").value = c;
};

(二)根据日期返回本周周一和周日的日期

/**
 * 根据日期返回本周周一和周日的日期
 * @param day
 *   参数日期
 * @param num
 *   第几周
 * @return oneWeek
 *   周一,周日所在日期  
 */
function getWeekDate(day,num) {
  
  num = num || 0;
  // 返回值:周一和周日所在的日期
  var oneWeek = {};
  // 初始日期
  var initDate = "";
  // 截取年月日
  initDate = day.split(' ')[0];
  // ie兼容性问题,将yyyy-MM-dd转换成yyyy/MM/dd
  initDate = initDate.replace(/-/g,"/");
  // 将string转换成Date
  initDate = new Date(Date.parse(initDate));//格式只能是yyyy/MM/dd
  
  // 返回 day距离1970 年 1 月 1 日0时0分的毫秒数
  var nowTime = initDate.getTime(); 
  // 返回星期的某一天的数字: 0(周日) 到 6(周六)
  var weekNum = initDate.getDay();
  // 一天所代表的毫秒数
  var oneDayTime = 24 * 60 * 60 * 1000; 
  
  //显示周一
  var MondayTime = nowTime - (weekNum - 1) * oneDayTime ; 
  //显示周日
  var SundayTime = nowTime + (7 - weekNum) * oneDayTime ; 
  if (0 != num) {
    MondayTime += 7 * num * oneDayTime;
    SundayTime += 7 * num * oneDayTime;
  }
  
  //初始化日期时间
  var monday = new Date(MondayTime);
  var sunday = new Date(SundayTime);
  // formatDate是自定义的格式化方法
  monday = monday.formatDate('yyyy-MM-dd');
  sunday = sunday.formatDate('yyyy-MM-dd');
  
  oneWeek.Monday = monday;
  oneWeek.Sunday = sunday;
  
  return oneWeek;
}

 测试:

var week = getWeekDate('2017-05-27',0);    
console.log(week.Monday + "," + week.Sunday);

 注意:

 Date.parse()具有兼容性问题,低版本IE浏览器不支持"yyyy-MM-dd"转换成Date,只支持"yyyy/MM/dd"转换成日期。

 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
游览器中javascript的执行过程(图文)
May 20 Javascript
jQuery和AngularJS的区别浅析
Jan 29 Javascript
轻松实现js图片预览功能
Jan 18 Javascript
三种AngularJS中获取数据源的方式
Feb 02 Javascript
javascript函数自动执行常用方法汇总
Mar 28 Javascript
jQuery Easyui 下拉树组件combotree
Dec 16 Javascript
JS敏感词过滤代码
Dec 23 Javascript
Vue实现动态显示textarea剩余字数
May 22 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
Sep 26 Javascript
JS实现监控微信小程序的原理
Jun 15 Javascript
详解node登录接口之密码错误限制次数(含代码)
Oct 25 Javascript
AngularJS动态生成select下拉框的方法实例
Nov 17 Javascript
Vue实现选择城市功能
May 27 #Javascript
使用 Node.js 对文本内容分词和关键词抽取
May 27 #Javascript
vue子组件使用自定义事件向父组件传递数据
May 27 #Javascript
javascript回调函数的概念理解与用法分析
May 27 #Javascript
原生JavaScript实现的简单省市县三级联动功能示例
May 27 #Javascript
原生JavaScript实现精美的淘宝轮播图效果示例【附demo源码下载】
May 27 #Javascript
详细讲解vue2+vuex+axios
May 27 #Javascript
You might like
使用PHPMyAdmin修复论坛数据库的图文方法
2012/01/09 PHP
PHP正则匹配日期和时间(时间戳转换)的实例代码
2016/12/14 PHP
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
2009/11/26 Javascript
『JavaScript』限制Input只能输入数字实现思路及代码
2013/04/22 Javascript
深入浅析JavaScript中的arguments对象(强力推荐)
2016/06/03 Javascript
JavaScript的字符串方法汇总
2016/07/31 Javascript
JQuery Ajax 异步操作之动态添加节点功能
2017/05/24 jQuery
cropper js基于vue的图片裁剪上传功能的实现代码
2018/03/01 Javascript
vue+axios新手实践实现登陆的示例代码
2018/06/06 Javascript
Bootstrap 模态框自定义点击和关闭事件详解
2018/08/10 Javascript
Bootstrap4 gulp 配置详解
2019/01/06 Javascript
vue router 用户登陆功能的实例代码
2019/04/24 Javascript
JavaScript变量作用域及内存问题实例分析
2019/06/10 Javascript
JS script脚本中async和defer区别详解
2020/06/24 Javascript
vue select 获取value和lable操作
2020/08/28 Javascript
iview实现动态表单和自定义验证时间段重叠
2021/01/10 Javascript
[01:38]DOTA2 2015国际邀请赛中国区预选赛 Showopen
2015/06/01 DOTA
python设置windows桌面壁纸的实现代码
2013/01/28 Python
python任务调度实例分析
2015/05/19 Python
Python中unittest模块做UT(单元测试)使用实例
2015/06/12 Python
Python 迭代器与生成器实例详解
2017/05/18 Python
详谈Python高阶函数与函数装饰器(推荐)
2017/09/30 Python
Python实现求一个集合所有子集的示例
2018/05/04 Python
删除python pandas.DataFrame 的多重index实例
2018/06/08 Python
python计算列表内各元素的个数实例
2018/06/29 Python
更新修改后的Python模块方法
2019/03/03 Python
Python中面向对象你应该知道的一下知识
2019/07/10 Python
用Python实现最速下降法求极值的方法
2019/07/10 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
自荐信封面
2013/12/04 职场文书
施工安全生产承诺书
2014/05/23 职场文书
道路运输企业安全生产责任书
2014/07/28 职场文书
2014年工程师工作总结
2014/11/25 职场文书
三年级学生期末评语
2014/12/26 职场文书
技术员岗位职责
2015/02/04 职场文书
先进教师个人主要事迹材料
2015/11/03 职场文书