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 相关文章推荐
LBS blog sql注射漏洞[All version]-官方已有补丁
Aug 26 Javascript
js中Math之random,round,ceil,floor的用法总结
Dec 26 Javascript
javascript操作ul中li的方法
May 14 Javascript
jQuery中attr()与prop()函数用法实例详解(附用法区别)
Dec 29 Javascript
js控制li的隐藏和显示实例代码
Oct 15 Javascript
Vue单文件组件基础模板小结
Aug 10 Javascript
jQuery Datatable 多个查询条件自定义提交事件(推荐)
Aug 24 jQuery
详解React开发必不可少的eslint配置
Feb 05 Javascript
vscode中vue-cli项目es-lint的配置方法
Jul 30 Javascript
微信小程序实现留言板功能
Nov 02 Javascript
es6 filter() 数组过滤方法总结
Apr 03 Javascript
jquery实现的放大镜效果示例
Feb 24 jQuery
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
linux php mysql数据库备份实现代码
2009/03/10 PHP
PHP大批量数据操作时临时调整内存与执行时间的方法
2011/04/20 PHP
mac下Apache + MySql + PHP搭建网站开发环境
2014/06/02 PHP
PHP中Trait及其应用详解
2017/02/14 PHP
php实现解析xml并生成sql语句的方法
2018/02/03 PHP
一些常用的JS功能函数(2009-06-04更新)
2009/06/04 Javascript
js将iframe中控件的值传到主页面控件中的实现方法
2013/03/11 Javascript
单击浏览器右上角的X关闭窗口弹出提示的小例子
2013/06/12 Javascript
Jquery使用Firefox FireBug插件调试Ajax步骤讲解
2013/12/02 Javascript
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
AngularJS学习笔记之基本指令(init、repeat)
2015/06/16 Javascript
TinyMCE汉化及本地上传图片功能实例详解
2016/05/31 Javascript
浅谈angularjs $http提交数据探索
2017/01/20 Javascript
浅谈react+es6+webpack的基础配置
2017/08/09 Javascript
js canvas实现简单的图像扩散效果
2020/06/28 Javascript
nuxt.js 缓存实践
2018/06/25 Javascript
JS常见构造模式实例对比分析
2018/08/27 Javascript
node.js中express模块创建服务器和http模块客户端发请求
2019/03/06 Javascript
Javascript Web Worker使用过程解析
2020/03/16 Javascript
echarts饼图各个板块之间的空隙如何实现
2020/12/01 Javascript
[02:52]2014DOTA2西雅图国际邀请赛 CIS战队巡礼
2014/07/07 DOTA
pyqt4教程之实现windows窗口小示例分享
2014/03/07 Python
python在控制台输出进度条的方法
2015/06/20 Python
快速解决pyqt5窗体关闭后子线程不同时退出的问题
2019/06/19 Python
详解python破解zip文件密码的方法
2020/01/13 Python
使用python客户端访问impala的操作方式
2020/03/28 Python
jupyter lab的目录调整及设置默认浏览器为chrome的方法
2020/04/10 Python
python smtplib发送多个email联系人的实现
2020/10/09 Python
Python 实现PS滤镜的旋涡特效
2020/12/03 Python
金融专业推荐信
2013/11/14 职场文书
元旦寄语大全
2014/04/10 职场文书
创先争优标语
2014/06/27 职场文书
2014年体育工作总结
2014/11/24 职场文书
公司欠款证明
2015/06/24 职场文书
推普标语口号大全
2015/12/26 职场文书
Python 高级库15 个让新手爱不释手(推荐)
2021/05/15 Python