通过实例解析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 相关文章推荐
获取任意Html元素与body之间的偏移距离 offsetTop、offsetLeft (For:IE5+ FF1 )[
Dec 22 Javascript
javascript自执行函数之伪命名空间封装法
Dec 25 Javascript
JS连接SQL数据库与ACCESS数据库的方法实例
Nov 21 Javascript
js 剪切板应用clipboardData详细解析
Dec 17 Javascript
js控制多图左右滚动切换效果代码分享
Aug 26 Javascript
js获取本机操作系统类型的两种方法
Dec 19 Javascript
javascript实现简单加载随机色方块
Dec 25 Javascript
AngularJS中下拉框的基本用法示例
Oct 11 Javascript
js实现以最简单的方式将数组元素添加到对象中的方法
Dec 20 Javascript
vue中tab选项卡的实现思路
Nov 25 Javascript
js微信分享接口调用详解
Jul 23 Javascript
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
解决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 创建标签云函数代码
2010/05/26 PHP
PHP输出XML到页面的3种方法详解
2013/06/06 PHP
ThinkPHP3.1新特性之Action参数绑定
2014/06/19 PHP
基础的WordPress插件制作教程
2015/11/24 PHP
PHP读取XML格式文件的方法总结
2017/02/27 PHP
PHP远程连接oracle数据库操作实现方法图文详解
2019/04/11 PHP
在修改准备发的批量美化select+可修改select时,在非IE下发现了几个问题
2007/01/09 Javascript
IE和firefox浏览器的event事件兼容性汇总
2009/12/06 Javascript
解析js如何获取当前url中的参数值并复制给input
2013/06/23 Javascript
JS+CSS简单树形菜单实现方法
2015/09/12 Javascript
jQuery点击其他地方时菜单消失的实现方法
2016/04/22 Javascript
vue-resource调用promise取数据方式详解
2017/07/21 Javascript
使用Bootstrap4 + Vue2实现分页查询的示例代码
2017/12/21 Javascript
在vue中利用全局路由钩子给url统一添加公共参数的例子
2019/11/01 Javascript
Python实现遍历数据库并获取key的值
2015/05/17 Python
ubuntu系统下 python链接mysql数据库的方法
2017/01/09 Python
《Python学习手册》学习总结
2018/01/17 Python
python简单实现操作Mysql数据库
2018/01/29 Python
如何使用VSCode愉快的写Python于调试配置步骤
2018/04/06 Python
Python实现的本地文件搜索功能示例【测试可用】
2018/05/30 Python
将Dataframe数据转化为ndarry数据的方法
2018/06/28 Python
pandas 选择某几列的方法
2018/07/03 Python
python调用java的jar包方法
2018/12/15 Python
python实现飞行棋游戏
2020/02/05 Python
MATLAB数学建模之画图汇总
2020/07/16 Python
HTML5未来发展趋势
2016/02/01 HTML / CSS
法国在线宠物店:zooplus.fr
2018/02/23 全球购物
PHP高级工程师面试问题推荐
2013/01/18 面试题
刚毕业大学生自荐信范文
2014/02/20 职场文书
学校安全生产承诺书
2014/05/23 职场文书
学雷锋活动总结报告
2014/06/26 职场文书
村党支部书记四风问题个人对照检查材料思想汇报
2014/10/06 职场文书
2015年社区中秋节活动总结
2015/03/23 职场文书
2015年度企业工作总结
2015/05/21 职场文书
2015年支教教师工作总结
2015/07/22 职场文书
如何书写授权委托书?
2019/06/25 职场文书