JS原生date对象的实际应用,满满的干货!

更多文章可关注我的个人博客:https://seven777777.github.io/myblog/

Date对象用于处理日期和时间

一、new Date()

默认状态下,new Date()会返回当前日期和时间,格式如下

var date = new Date() //Tue Sep 29 2020 16:38:00 GMT+0800 (中国标准时间)

创建特定的时间,传参如下:

  1. new Date(“month dd,yyyy hh:mm:ss”);
  2. new Date(“month dd,yyyy”);
  3. new Date(yyyy,mth,dd,hh,mm,ss);
  4. new Date(yyyy,mth,dd)
  5. new Date(ms)

month:用英文 表示月份名称,从January到December

mth:用整数表示月份,从0(1月)到11(12月)

dd:表示一个 月中的第几天,从1到31

yyyy:四位数表示的年份

hh:小时数,从0(午夜)到23(晚11点)

mm: 分钟数,从0到59的整数

ss:秒数,从0到59的整数

ms:毫秒数,为大于等于0的整数

二、new Date()——>时间戳,年月日,等

转时间戳

时间戳是指格林威治时间自1970年1月1日(00:00:00 GMT)至当前时间的总秒数

var date = new Date()

date.valueOf() // 1601368680782
date.getTime() // 1601368680782
Number(date) // 1601368680782

// 以上返回的都是毫秒数,转成时间戳需要将毫秒转成秒
// 如:Math.round(new Date().getTime()/1000)
Math.round(date.getTime()/1000) // 1601368681
获取年月日
var date = new Date()

// 年
date.getFullYear() // 2020
// 月(实际月份为 结果 + 1,当前为9月)
date.getMonth() // 8
// 日
date.getDate() // 29
// 星期几
date.getDay() // 2  返回结果为0~6,表示一周中的某一天,0表示周日

获取时分秒
var date = new Date()

// 时
date.getHours() // 16
// 分
date.getMinutes() // 38
// 秒
date.getSeconds() // 0
// 毫秒
date.getMilliseconds() // 782

通过获取年月日,时分秒,可以进行多个时间之间的时间差运算,实际业务场景还是蛮多的,不过现在有很多库,比如moment.js
,对于一些运算进行了封装,使用起来也很方便。但对于原生的实现,也还是很有了解的必要的。

Date 对象转换为字符串

常用于当前Date的更直观的显示。

var date = new Date()

date.toTimeString() // 16:38:00 GMT+0800 (中国标准时间)
date.toDateString() // Tue Sep 29 2020
date.toLocaleString()// 2020/9/29 下午4:38:00
date.toLocaleTimeString()// 下午4:38:00
date.toLocaleDateString()// 2020/9/29

关于toLocaleString,还有些有趣的应用,有兴趣的可以看我的这篇文章:toLocaleString也太好用了吧!(超方便转千分位,中文数字等)

三、时间戳——>普通时间

var timestamp = 1601368681

new Date(timestamp * 1000).toLocaleString() // 2020/9/29 下午4:38:01
new Date(timestamp * 1000).toLocaleDateString() // 2020/9/29

实际上就是将时间戳转换成Date对象,然后就可以使用上面Date对象的所有方法

而时间戳转Date对象说白了就是文章一开始列的创建特定时间的第五条方法:new Date(ms) 将时间戳乘以1000便得到了ms。

以上,可以根据上面的方法进行时间格式化函数的封装,此处就只提供一些基础方法了,之后有空可能会在出一篇格式化时间的函数封装的文章。

搴芳拾梦
欢迎关注的我的个人公众号【搴芳拾梦】

猜你喜欢

转载自blog.csdn.net/Seven521m/article/details/108872246