Date对象

在ArkTS 中另外一个常用的内置对象 Date，他可以用来创建、解析、操作日期和时间。

1.实例方法

它的实例方法有：

要使用这些实例方法前要先进行实例化

//实例化
const date: Date = new Date()


// 实例方法调用演示
console.log('年:', date.getFullYear())
//  ✨✨getMonth()获得的月份比当前月份少1，所以需要加1才能拿到正常的月份值
console.log('月:', date.getMonth())
console.log('日:', date.getDate())
console.log('时:', date.getHours())
console.log('分:', date.getMinutes())
console.log('秒:', date.getSeconds())
// ✨✨星期返回：周日：0，周一：1，。。。
console.log('星期:', date.getDay())

特别的一些用法：

// 获取指定日期
// ISO 8601 格式（YYYY-MM-DDTHH:mm:ss.ssZ）中间用 T 分隔
const date2: Date = new Date('1995-01-01T01:11:00')    //输出：Sun Jan 01 1995 01:11:00 GMT+0800


// Unix时间戳 是指从1970年1月1日（UTC）开始到现在经历的时间（毫秒）
const date3: Date = new Date(1706170405708)    //输出  Thu Jan 25 2024 16:13:25 GMT+0800

2. 静态方法

这种方法是不需要进行实例化的，直接使用类Date.now

//时间戳指的是：一个日期 减去 1970-1-1日获得的毫秒数
console.log(Date.now()+'')

3.案例-时钟

需求：

1. 开屏显示

• 默认显示当前的 年月日

• 星期

• 时分秒

2. 倒计时

• 时分秒持续改变

3.1.获得当前日期

getNow() {
    let date = new Date()
    let year = date.getFullYear()
    let month = date.getMonth() + 1
    let day = date.getDate()

    return `${year}年${month}月${day}日`
  }

说明：这里获得的月份要比实际的少一个月，所以这里要加一

3.2.获得星期

 getWeek() {
    let date = new Date()
    let weekDay = date.getDay() // 周日为0
    let resWeek = ''
    switch (weekDay) {
      case 0:
        resWeek = '周日'
        break
      case 1:
        resWeek = '周一'
        break
      case 2:
        resWeek = '周二'
        break
      case 3:
        resWeek = '周三'
        break
      case 4:
        resWeek = '周四'
        break
      case 5:
        resWeek = '周五'
        break
      case 6:
        resWeek = '周六'
        break
      default:
    }

    return resWeek
  }

说明：因为date.getDay()返回的是一个数字类型，所以这里使用switch进行分情况转为“周几”，注意，周天为0

3.3.设置时钟时间变化

说明：其中的setInterval为定时器，每秒进行一次获取时间，onAppear()是在加载完成时自动进行里面代码的运行，相比较于onclick而已，省去了自己去点击运行。

完整代码

@Entry
@Component
struct Date01 {
  // 1. 获取当前日期
  getNow() {
    let date = new Date()
    let year = date.getFullYear()
    let month = date.getMonth() + 1
    let day = date.getDate()

    return `${year}年${month}月${day}日`
  }

  // 2. 获取星期
  getWeek() {
    let date = new Date()
    let weekDay = date.getDay() // 周日为0
    let resWeek = ''
    switch (weekDay) {
      case 0:
        resWeek = '周日'
        break
      case 1:
        resWeek = '周一'
        break
      case 2:
        resWeek = '周二'
        break
      case 3:
        resWeek = '周三'
        break
      case 4:
        resWeek = '周四'
        break
      case 5:
        resWeek = '周五'
        break
      case 6:
        resWeek = '周六'
        break
      default:
    }

    return resWeek
  }

  // 3. 设置时钟时间变化
  @State hour: number = 0
  @State min: number = 0
  @State seconds: number = 0

  build() {
    Column() {
      Column() {
        Text(`${this.getNow()} ${this.getWeek()}`)
          .fontColor(Color.White)
          .fontSize(20)
        Stack() {
          Row({ space: 10 }) {
            Text(this.hour < 10 ? '0' + this.hour : this.hour.toString())
              .textStyle()
            Text(this.min < 10 ? '0' + this.min : this.min.toString())
              .textStyle()
            Text(this.seconds < 10 ? '0' + this.seconds : this.seconds.toString())
              .textStyle()
          }
          .onAppear(() => {
            // 3. 设置时钟时间变化
            setInterval(() => {
              let date = new Date()
              this.hour = date.getHours()
              this.min = date.getMinutes()
              this.seconds = date.getSeconds()
            }, 1000)
          })

          Divider()
            .strokeWidth(2)
            .color(Color.Black)
        }
        .padding(10)

        Text('求知若渴，虚心若愚')
          .fontColor(Color.White)
          .fontSize(18)
      }

    }
    .width('100%')
    .height('100%')
    .backgroundColor(Color.Black)
    .justifyContent(FlexAlign.Center)
  }
}


@Extend(Text)
function textStyle() {
  .width(100)
  .height(100)
  .backgroundColor('#191919')
  .borderRadius(10)
  .textAlign(TextAlign.Center)
  .fontColor(Color.White)
  .fontSize(70)
  .fontWeight(900)
}