前端JS基础：日期对象

日期对象：用来表示时间的对象作用：可以得到当前系统时间

1，实例化

• 在代码中发现new关键字的时候，一般将这个操作称为实例化
• 创建一个对象并获取事时间。

       获取当前时间

 <script>
   // 1,实例化 new 
   const date = new Date
   console.log(date); 
 </script>

           

获得指定时间

    const date1 = new Date('2024-10-1')

2，日期对象的方法

使用场景：因为日期对象返回的数据我们不能直接使用，所以需要转换为实际开发中常用的格式

 

方法	作用	说明
getFullYear()	获得年份	获取四位年份
getMonth()	获得月份	取值为0~11 注意+1
getDate()	获取月份中的每一天	不同月份取值也不相同
getDay()	获取星期	取值为0~6
getHours()	获取小时	取值为0~23
getMinutes()	获取分钟	取值为0~59
getSeconds()	获取秒	取值为0~59

使用方法：

    // 获取日期对象
    const date = new Date()
    // 使用里面的方法
    console.log(date.getFullYear());
    console.log(date.getMonth() + 1);

应用：

日期的格式化写法：

    const div = document.querySelector('div')
    function getMyDate() {
      const date = new Date()
      let h = date.getHours()
      h = h > 10 ? h : '0' + h
      let m = date.getMinutes()
      m = m > 10 ? m : '0' + m
      let s = date.getMinutes()
      s = s > 10 ? s : '0' + s

      return `今天是：${date.getFullYear()}年
      ${date.getMonth() + 1}月
      ${date.getDate()}号
       ${h}：${m}：${s}`
    }
    div.innerHTML = getMyDate()

简便方法：

    const div = document.querySelector('div')
    const date = new Date()
    div.innerHTML = date.toLocaleDateString()//2024/6/2
    div.innerHTML = date.toLocaleTimeString()//17:17:03
    div.innerHTML = date.toLocaleString()//2024/6/2 17:17:03

3，时间戳

使用场景：如果计算倒计时效果，前面方法无法直接计算，需要借助于时间戳完成

什么是时间戳：

• 指1970年01月01日00时00分00秒起至现在的毫秒数，它是一种特殊的计量时间的方式

算法：

• 将来的时间戳-现在的时间戳=剩余时间毫秒数
• 剩余时间毫秒数转换为剩余时间的 年月 日 时 分 秒 就是倒计时时间
• 比如 ：将来时间戳 2000ms - 现在时间戳1000ms = 1000ms 
• 1000ms转换为就是0小时0分1秒

 

三种方式获取时间戳：

1.使用getTime()方法

const date = newDate()

console.log(date.getTime())

2.简写+newDate()

本质是把new Date日期的字符串前面加＋号转化成数字型的毫秒数

• 无需实例化

console.log(+newDate())

3.使用Date.now()

• 无需实例化
• 但是只能得到当前的时间戳，而前面两种可以返回指定时间的时间戳