当前位置:首页 » 《随便一记》 » 正文

JavaScript- Date日期对象的使用(附操作实例)_Brother.汤的博客

12 人参与  2022年04月21日 12:51  分类 : 《随便一记》  评论

点击全文阅读


参考:Date - JavaScript | MDN(一种查找手册,网页版)

用处:创建Date实例是用来处理日期和时间;

一,初识Date

Date对象:是基于1970年1月1日(世界标准时间)起的毫秒数,Date对象是一个构造函数,需要实例化后才能使用。

Note:创建一个新Date对象的唯一方法是通过new 操作符,例如:var now = new Date(); 若将它作为常规函数调用(即不加 new 操作符),将返回一个字符串,而非 Date 对象。

1.使用Date(),没有参数,返回系统的当前时间。

var date = new Date();

console.log(date);

运行结果:Wed Nov 24 2021 23:48:16 GMT+0800 (中国标准时间)

2.Date()构造函数,如果括号里有时间作为参数,那就返回括号里的时间。

这里的时间表示又有俩种表示方式,分别是数字型:例如2021,11,24,字符串型:例如'2021-11-24';

通过代码来看看有啥不同:

var date1 = new Date('2021-11-24');//参数为字符串型

var date2 = new Date(2021, 11, 24);//参数为数字型

console.log(date1);

console.log(date2);

// Wed Nov 24 2021 08:00:00 GMT+0800 (中国标准时间)显示时间正常

// Fri Dec 24 2021 00:00:00 GMT+0800 (中国标准时间) 使用数字型的时候出现了问题,多加了一个月

Wed Nov 24 2021 08:00:00 GMT+0800 (中国标准时间)显示时间正常

 Fri Dec 24 2021 00:00:00 GMT+0800 (中国标准时间) 使用数字型的时候出现了问题,多加了一个月

目前还不知道具体原理,知道的就是参数用字符串较为稳妥。

二,日期格式化

提问:想得到2019-8-8 8:8:8的格式,怎么做呢?

note:需要获取日期的指定部分,需要我们手动得到这种形式。

下面列举出得到日期指定部分的方法:

方法名    说明代码
getFullYear()获取当年 dobj.getFullYear()
getMonth()获取当月(0-11)dobj.getMonth()
getDate()获取当天日期 dobj.getDate()
getDay()获取星期几(周日0到周六6)dobj.getDay()
getHours()获取当前小时   dobj.getHours()
getMinutes()获取当前分钟   dobj.getMinutes()
getSeconds()获取当前秒  dobj.getSeconds()

我们以 getFullYear() 为例, getFullYear()返回的值是绝对数。 对于1000到9999之间的日期,getFullYear()返回一个四位数字,如1995。使用此函数确保在2000年后兼容。

console.log(date.getDate());//返回的是几号

console.log(date.getDay());//返回值使一个数字,周一返回的是1,周六:6,周日为0

牛刀小试:

1.下面我们写个简单案例实践一下 ,中国人更喜欢的是××××年××月××日星期×这样的时间表示方法,这种形式如何用代码实现呢?

以2021年11月24日星期三为例

下面是代码实现

 var date=new Date();
 var year=date.getFullYear();
 var month=date.getMonth();
 var dates=date.getDate(); 
 var day=date.getDay();
//这里我们得到的是一个阿拉伯数字,表示不方便,所以用数组来存储星期的信息,把返回值作为下标
 var arr=['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];
 console.log('今天是'+year+'年'+month+'月'+dates+'天'+arr[day]);

2.如何得到时分秒呢?

和上面一样的方法,但代码要多敲才溜,所以我们再写一下。

 //格式化日期,时分秒 
 var date=new Date(); 
 console.log(date.getHours());//时
 console.log(date.getMinutes());//分 
 console.log(date.getSeconds());//秒

3.下面用一个实例来加深记忆 //要求封装一个函数来返回当前的时分秒,要求形式为类似于 08:08:08(小于10的时候十位要补0)

function getTimer()
{ 
  var time=new Date();
  var h=time.getHours();
  var m=time.getMinutes();
  var s=time.getSeconds(); //为了达到上面提及的效果,用三元表达式来改变形式
  h=h<10?'0'+h:h;
  m=m<10?'0'+m:m;
  s=s<10?'0'+s:s; 
  return h+':'+m+':'+s; } 
  console.log(getTimer());//这里再提一下,加深记忆,函数只有被调用才会执行。

三.获取Date总的毫秒数

Date总的毫秒数又名​​​​​​时间戳,因为一个时间对应的毫秒数是确定的,就像刻在那里一样,即基于1970年1月1日的毫秒数(我们经常利用总的毫秒数来计算时间,因为更加精确)


方法一:通过valueOf()或getTime()函数。

var date=new Date();

console.log(date.valueOf());//得到结果:1637813705392

console.log(date.getTime());//得到结果:1637813705392

方法二:简单方法(最常用的方法)

var date1=+new Date();//+new Date()返回的就是总的毫秒数

console.log(date1);

方法三:H5(HTML5)新增的方法

 console.log(Date.now());

下面用一个综合实践案例来巩固所学知识。

BOSS:倒计时案例

案例说明:输入一个截止时间,然后编写程序得出当前时间距离截止时间还剩多长时间 例如 还剩 00天00时00分01秒(输出格式)

1,核心算法:输入时间减去现在时间就是剩余时间,即倒计时,但是不能拿着时分秒直接相减,会出错,例如05分减去25分结果是负数。

2,所以我们使用时间戳(总的毫秒数)来做,用输入时间总的毫秒数减去现在时间的毫秒数,得到剩余时间的总毫秒数,再除以1000,得到剩余总秒数。

3,再把剩余时间总的秒数转换为天,时,分,秒 转换公式如下:

d=parseInt(总秒数/60/60/24);//天数

h=parseInt(总秒数/60/60%24);//小时

m=parseInt(总秒数/60%60);//分钟

s=parseInt(总秒数%60);//秒

代码部分:

function countDown(time)
{
   var nowTime=+new Date();
   var inputTime=+new Date(time); 
   var times=(inputTime-nowTime)/1000; 
   var d=parseInt(times/60/60/24);//天数 
   d=d<10?'0'+d:d; 
   var h=parseInt(times/60/60%24);//小时
   h=h<10?'0'+h:h; 
   var m=parseInt(times/60%60);//分钟
   m=m<10?'0'+m:m; 
  var s=parseInt(times%60);//秒 
  s=s<10?'0'+s:s;
  return d+'天'+h+'时'+m+'分'+s+'秒';
 } 
console.log(countDown('2021-11-25 23:00:00'));

得到结果:00天10时38分30秒

如有不恰当的地方,还望各位朋友指正(抱拳)


点击全文阅读


本文链接:http://m.zhangshiyu.com/post/38617.html

时间  星期  方法  
<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

关于我们 | 我要投稿 | 免责申明

Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1