JavaScript|日期对象

简介: JavaScript|日期对象

在JavaScript中没有日期类型的数据,但我们在开发的过程中经常需要处理日期,所以在这里我将在这里给展示大家如何用日期对象(Date)来操作日期和时间。


创建日期对象

在JavaScript中,创建日期对象必须使用new语句。使用关键字new新建日期对象时有以下四种方法;

方法一:日期对象 = new Date()

方法二:日期对象 = new Date(日期字串)

方法三:日期对象 = new Date(毫秒)

方法四:日期对象 = new Date(年,月,日[时,分,秒,[毫秒])

接下来我们用上述四种方式来创建日期对象。

<!DOCTYPE html>

<html>

       <head>

              <meta  charset="UTF-8">

              <title>日期对象</title>

              <script>

                     //以当前时间创建一个日期对象

                     var  myDate1 = new Date();

                     //将字符串转化成日期对象,该对象代表的日期为2020年3月8日

                     var  myDate2 = new Date("March 8,2020");

                     //将字符串转化成日期对象,该对象代表的日期为2020年3月8日

                     var  myDate3 = new Date("2020/3/8");

                     //创建一个日期对象,该对象代表的日期和时间为2020年3月8日10时38分46秒

                     var  myDate4 = new Date(2020,3,8,10,38,46);

                     //创建一个日期对象,该对象代表距离2020年1月1日0时0分0秒10000毫秒的时间

                     var  myDate5 = new Date(10000);

                     //分别输出以上日期对象的本地格式

                     document.write("myDate1  所代表的时间为:"+myDate1.toLocaleString()+"<br>");

                     document.write("myDate2  所代表的时间为:"+myDate2.toLocaleString()+"<br>");

                     document.write("myDate3  所代表的时间为:"+myDate3.toLocaleString()+"<br>");

                     document.write("myDate4  所代表的时间为:"+myDate4.toLocaleString()+"<br>");

                     document.write("myDate5  所代表的时间为:"+myDate5.toLocaleString()+"<br>");

              </script>

       </head>

<body>

        </body>

</html>

效果:

图1.1创建日期对象


日期对象常用方法的应用

日期对象的方法主要分为三大组:setXxx、getXxx和toXxx。setXxx方法用于设置时间和日期值;getXxx方法用于获取时间和日期;toXxx方法主要是将日期转化成指定格式。

日期对象的常用方法如下表:

图2.1日期对象常用方法的应用

接下来我们就来尝试一下以YYY-MM-DD AM H:M:S 学期X的格式显示日期:

<!DOCTYPE html>

<html>

       <head>

              <meta  charset="UTF-8">

              <title>日期对象</title>

              <script  type="text/javascript">

                     var  now = new Date(); //定义日期对象

                     //输出自定义的日期格式

                     document.write("今天是:" + now.toLocaleFormat("%Y-%m-%d %a %H:%M;%S %a"));

              </script>

       </head>

       <body>

       </body>

</html>

效果:

图2.2自定义日期格式

在这里我们用到了toLocaleFormat()方法;

它是JavaScript1.6新增加的功能,IE、Opera等浏览器都不支持。


日期间的运算

日期数据之间的运算通常包括一个日期对象加上整数年、月、日,以及两个日期对象进行相减运算。

1 日期对象与整数年、月、日相加

日期对象与整数年、月、日相加,需要将它们相加的结果,通过setXxx函数设置成新的日期对象,实现日期对象与整数年、月、日相加,语法格式如下:

date.setData(date.getData()+value) //增加天

date.setMonth(date.getMonth()+value) //增加月

date.setFullYear(date.getFullYear()+value)  //增加年

2 日期相减

JavaScript允许两个日期对象的相减,相减之后返回的是这两个日期之间的毫秒数。通常我们会将毫秒转化成秒、分、小时、天等。接下来来举例说明一下。

<!DOCTYPE html>

<html>

       <head>

              <meta  charset="UTF-8">

              <title>日期对象</title>

              <script>

                     var  now = new Date(); //定义日期对象

                     var  nationalDay = new Date(2021,1,1,0,0,0); //2021年元旦定义日期对象

                     var  msel = nationalDay-now;//相差的毫秒数

                     //输出相差时间

                     document.write("距离2021年元旦还有:"+msel+"毫秒<br>");

                     document.write("距离2021年元旦还有:"+parseInt(msel/1000)+"秒<br>");

                     document.write("距离2021年元旦还有:"+parseInt(msel/(1000*60))+"分钟<br>");

                     document.write("距离2021年元旦还有:"+parseInt(msel/(1000*60*60))+"分钟<br>");  

                     document.write("距离2021年元旦还有:"+parseInt(msel/(1000*60*60*24))+"天<br");

              </script>

       </head>

       <body>

       </body>

</html>

效果:

图3.2日期相减


总结

日期是我们在生活中很重要的东西,在做网页或者是其它东西的时候也都少不了日期的,运用JavaScript的日期对象可以做很多事情,比如算算期末考试还有好久,把日期变成自己想要的格式等。对于JavaScript的日期对象和它的一些常用方法要熟练的掌握,才能更好的完成自己的作品和项目。




目录
相关文章
|
28天前
|
JavaScript 前端开发
如何在 JavaScript 中使用 __proto__ 实现对象的继承?
使用`__proto__`实现对象继承时需要注意原型链的完整性和属性方法的正确继承,避免出现意外的行为和错误。同时,在现代JavaScript中,也可以使用`class`和`extends`关键字来实现更简洁和直观的继承语法,但理解基于`__proto__`的继承方式对于深入理解JavaScript的面向对象编程和原型链机制仍然具有重要意义。
|
1月前
|
Web App开发 JavaScript 前端开发
如何确保 Math 对象的方法在不同的 JavaScript 环境中具有一致的精度?
【10月更文挑战第29天】通过遵循标准和最佳实践、采用固定精度计算、进行全面的测试与验证、避免隐式类型转换以及持续关注和更新等方法,可以在很大程度上确保Math对象的方法在不同的JavaScript环境中具有一致的精度,从而提高代码的可靠性和可移植性。
|
1月前
|
JavaScript 前端开发 图形学
JavaScript 中 Math 对象常用方法
【10月更文挑战第29天】JavaScript中的Math对象提供了丰富多样的数学方法,涵盖了基本数学运算、幂运算、开方、随机数生成、极值获取以及三角函数等多个方面,为各种数学相关的计算和处理提供了强大的支持,是JavaScript编程中不可或缺的一部分。
|
1月前
|
JavaScript 前端开发 搜索推荐
Moment.js、Day.js、Miment,日期时间库怎么选?
【10月更文挑战第29天】如果你需要一个功能强大、插件丰富的日期时间库,并且对性能要求不是特别苛刻,Moment.js是一个不错的选择;如果你追求极致的轻量级和高性能,那么Day.js可能更适合你;而如果你有一些特定的日期时间处理需求,并且希望在性能和功能之间取得平衡,Miment也是可以考虑的。
|
2月前
|
存储 JavaScript 前端开发
JavaScript 对象的概念
JavaScript 对象的概念
38 4
|
2月前
|
缓存 JavaScript 前端开发
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
42 1
|
2月前
|
存储 JavaScript 前端开发
js中函数、方法、对象的区别
js中函数、方法、对象的区别
21 2
|
2月前
|
JavaScript 前端开发 Unix
Node.js 全局对象
10月更文挑战第5天
32 2
|
2月前
|
存储 JavaScript 前端开发
js中的对象
js中的对象
21 3
|
2月前
|
JavaScript 前端开发 大数据
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
在JavaScript中,Object.assign()方法或展开语法(...)来合并对象,Object.freeze()方法来冻结对象,防止对象被修改
31 0