通过实例解析javascript Date对象属性及方法


Posted in Javascript onNovember 04, 2020

日常生活中,各种形式的时间字符到处都是。时间观念的产生,时间单位、计时工具的发明,给人类带来的变化实在一言难尽。今天就来谈谈日期那些事儿。一起来看看 JavaScript 中的日期对象 Date。

获取月份天数

// 获取月份天数
function getMonthDayCount(year, month) {
 return new Date(year, month, 0).getDate();
}
console.log(getMonthDayCount(2017, 10)); // 31

Date 第三个参数的本质跟 setDate 是一样的。

因为 date 为 0 时自动退到上个月的最后一天,所以这里月份也不需要减,正好的。

获取所有月份天数

function getAllMonthDayCount(year) {
 var days = [31, new Date(year, 2, 0).getDate(), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
 return days;
}
console.log(getAllMonthDayCount(2016));// [31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]

这个算是上面的延伸,不多解释。

是否是闰年

function isLeapYear(year) {
 return (year % 4 == 0) && (year % 100 != 0 || year % 400 == 0);
}

这是网上的web前端开发里相关代码,相信大多数人都用。但其实你真的理解或者能记住么?光是html和css就足够多记的了

function isLeapYear(year) {
 return new Date(year, 2, 0).getDate() === 29;
}
console.log([
 isLeapYear(2000),
 isLeapYear(2016),
 isLeapYear(2017),
 isLeapYear(2018)
]); // [ true, true, false, false ]

这样看,是不是就非常简单容易理解了。

而且都不需要记,是不是想忘都忘不了?

天数加减操作

之前看到有人用相对秒数在计算几天前或几天后,甚至还在算跨月,跨年的情况。

其实直接 setDate 就好了,自动处理 跨月,跨年 的情况。

// 10天后是几月几号
var dt = new Date('2016-12-25');
dt.setDate(dt.getDate() + 10);
console.log(dt.toLocaleDateString()); // 2017/1/4

// 10天前是几月几号
var dt = new Date('2017-01-04');
dt.setDate(dt.getDate() - 10);
console.log(dt.toLocaleDateString()); // 2016/12/25

下面我将JavaScript Date 对象的对象和方法总结成一个表,让大家参考,也可以关注javascript参考手册。

Date 对象属性

属性 描述
constructor 返回对创建此对象的 Date 函数的引用。
prototype 使您有能力向对象添加属性和方法。

Date 对象方法

方法 描述
Date() 返回当日的日期和时间。
getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。
getMonth() 从 Date 对象返回月份 (0 ~ 11)。
getFullYear() 从 Date 对象以四位数字返回年份。
getYear() 请使用 getFullYear() 方法代替。
getHours() 返回 Date 对象的小时 (0 ~ 23)。
getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。
getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。
etMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。
getTime() 返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset() 返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate() 根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay() 根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCMonth() 根据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCFullYear() 根据世界时从 Date 对象返回四位数的年份。
getUTCHours() 根据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMinutes() 根据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCSeconds() 根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getUTCMilliseconds() 根据世界时返回 Date 对象的毫秒(0 ~ 999)。
parse() 返回1970年1月1日午夜到指定日期(字符串)的毫秒数。
setDate() 设置 Date 对象中月的某一天 (1 ~ 31)。
setMonth() 设置 Date 对象中月份 (0 ~ 11)。
setFullYear() 设置 Date 对象中的年份(四位数字)。
setYear() 请使用 setFullYear() 方法代替。
setHours() 设置 Date 对象中的小时 (0 ~ 23)。
setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)。
setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)。
setMilliseconds() 设置 Date 对象中的毫秒 (0 ~ 999)。
setTime() 以毫秒设置 Date 对象。
setUTCDate() 根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCMonth() 根据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCFullYear() 根据世界时设置 Date 对象中的年份(四位数字)。
setUTCHours() 根据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMinutes() 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCSeconds() 根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
setUTCMilliseconds() 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
toSource() 返回该对象的源代码。
toString() 把 Date 对象转换为字符串。
toTimeString() 把 Date 对象的时间部分转换为字符串。
toDateString() 把 Date 对象的日期部分转换为字符串。
toGMTString() 请使用 toUTCString() 方法代替。
toUTCString() 根据世界时,把 Date 对象转换为字符串。
toLocaleString() 根据本地时间格式,把 Date 对象转换为字符串。
toLocaleTimeString() 根据本地时间格式,把 Date 对象的时间部分转换为字符串。
toLocaleDateString() 根据本地时间格式,把 Date 对象的日期部分转换为字符串。
UTC() 根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。
valueOf() 返回 Date 对象的原始值。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript XML操作 封装类
Jul 01 Javascript
深入理解Javascript动态方法调用与参数修改的问题
Dec 10 Javascript
js单词形式的运算符
May 06 Javascript
Node.js事件循环(Event Loop)和线程池详解
Jan 28 Javascript
javascript中返回顶部按钮的实现
May 05 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
Sep 19 Javascript
Javascript基于AJAX回调函数传递参数实例分析
Dec 15 Javascript
浅谈js算法和流程控制
Dec 29 Javascript
80%应聘者都不及格的JS面试题
Mar 21 Javascript
vue组件发布到npm简单步骤
Nov 30 Javascript
vue实现未登录跳转到登录页面的方法
Jul 17 Javascript
JavaScript实现轮播图效果代码实例
Sep 28 Javascript
解决vue项目打包上服务器显示404错误,本地没出错的问题
Nov 03 #Javascript
解决vant-UI库修改样式无效的问题
Nov 03 #Javascript
解决vant title-active-color与title-inactive-color不生效问题
Nov 03 #Javascript
如何在vue中使用百度地图添加自定义覆盖物(水波纹)
Nov 03 #Javascript
JavaScript语法约定和程序调试原理解析
Nov 03 #Javascript
解决vux 中popup 组件Mask 遮罩在最上层的问题
Nov 03 #Javascript
React Native登录之指纹登录篇的示例代码
Nov 03 #Javascript
You might like
PHP设计模式之解释器模式的深入解析
2013/06/13 PHP
PHP两种去掉数组重复值的方法比较
2014/06/19 PHP
php函数实现判断是否移动端访问
2015/03/03 PHP
是 WordPress 让 PHP 更流行了 而不是框架
2016/02/03 PHP
php版微信公众平台之微信网页登陆授权示例
2016/09/23 PHP
使用Zookeeper分布式部署PHP应用程序
2019/03/15 PHP
JavaScript Base64编码和解码,实现URL参数传递。
2006/09/18 Javascript
javaScript对文字按照拼音排序实现代码
2013/12/27 Javascript
JQuery 图片滚动轮播示例代码
2014/03/24 Javascript
简单的js图片轮换代码(js图片轮播)
2014/05/06 Javascript
javascript 操作符(~、&、|、^、)使用案例
2014/12/31 Javascript
jQuery显示和隐藏 常用的状态判断方法
2015/01/29 Javascript
js实现随屏幕滚动的带缓冲效果的右下角广告代码
2015/09/04 Javascript
Bootstrap 源代码分析(未完待续)
2016/08/17 Javascript
Bootstrap栅格系统使用方法及页面调整变形的解决方法
2017/03/10 Javascript
详解AngularJS用Interceptors来统一处理HTTP请求和响应
2017/06/08 Javascript
JavaScript内存泄漏的处理方式
2017/11/20 Javascript
angular1配合gulp和bower的使用教程
2018/01/19 Javascript
解决VUE框架 导致绑定事件的阻止冒泡失效问题
2018/02/24 Javascript
解决vue-router 切换tab标签关闭时缓存问题
2020/07/22 Javascript
js编写简易的计算器
2020/07/29 Javascript
vue render函数动态加载img的src路径操作
2020/10/26 Javascript
深入浅析python3中的unicode和bytes问题
2019/07/03 Python
使用OpenCV实现仿射变换—缩放功能
2019/08/29 Python
详解python os.path.exists判断文件或文件夹是否存在
2020/11/16 Python
如何开发一款堪比APP的微信小程序(腾讯内部团队分享)
2016/12/22 HTML / CSS
来自美国主售篮球鞋的零售商店:KICKSUSA
2017/11/28 全球购物
大学生实习证明范本
2014/01/15 职场文书
金融管理专业毕业生求职信
2014/03/12 职场文书
社区义诊活动总结
2014/04/30 职场文书
2014年小学安全工作总结
2014/12/04 职场文书
2015年毕业实习工作总结
2014/12/12 职场文书
务虚会发言材料
2014/12/25 职场文书
教师远程培训心得体会
2016/01/09 职场文书
MySQL基础(一)
2021/04/05 MySQL
游戏《铁拳》动画化!2022年年内播出
2022/03/21 日漫