日期对象:用来表示时间的对象
作用:可以得到当前系统时间
14.1实例化
●在代码中发现了new关键字时,一般将这个操作称为实例化
●创建一个时间对象并获取时间
➢获得当前时间
const date = new Date( )
➢获得指定时间
const date = new Date('2008-8-8')
14.2日期对象方法
使用场景:因为日期对象返回的数据我们不能直接使用,所以需要转换为实际开发中常用的格式
案例-页面显示实时时间
【示例代码】
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
width: 180px;
height: 30px;
border: 1px solid #000;
text-align: center;
line-height: 30px;
}
</style>
</head>
<body>
<div></div>
<script>
const div = document.querySelector('div')
function getMyDate() {
const date = new Date()
let h = date.getHours()
h = h < 10 ? '0' + h : h
let m = date.getMinutes()
m = m < 10 ? '0' + m : m
let s = date.getSeconds()
s = s < 10 ? '0' + s : s
return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()} ${h}:${m}:${s}`
}
div.innerHTML = getMyDate()
setInterval(function () {
div.innerHTML = getMyDate()
}, 1000)
</script>
</body>
</html>
另外一种写法,更简便:
<script>
const div = document.querySelector('div')
const date = new Date()
div.innerHTML = date.toLocaleString()
setInterval(function () {
const date = new Date()
div.innerHTML = date.toLocaleString()
}, 1000)
</script>
14.3获取时间的简便方法
date.toLocaleString() // 2023/8/1 20:58:20
date.toLocaleDateString() // 2023/8/1
date.toLocaleTimeString() // 20:58:20
14.4时间戳
●使用场景:如果计算倒计时效果,前面方法无法直接计算,需要借助于时间戳完成
●时间戳:是指1970年01月01日00时00分00秒起至现在的毫秒数,它是一种特殊的计量时间的方式
●算法:
➢将来的时间戳 - 现在的时间戳 = 剩余时间毫秒数
➢剩余时间毫秒数转换为剩余时间的年月日时分秒就是倒计时时间
比如 将来时间戳2000ms -现在时间戳1000ms = 1000ms
➢1000ms 转换为就是0小时0分1秒
14.5时间戳的获取
有三种获取方式:
1.使用getTime() 方法
const date = new Date( )
console.log(date.getTime())
2.简写 +new Date() (重点)
➢无需 实例化
console.log(+new Date( ))
3.使用Date.now()
➢无需实例化
➢但是只能得到当前的时间戳,而前面两种可以返回指定时间的时间戳
console.log(Date.now())