整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

在js中常见的时间格式及其转换

在js中常见的时间格式及其转换

计算机编程中,常见的时间格式有以下几种:

1:ISO 8601 格式:国际标准的日期和时间表示方法。
格式为 "YYYY-MM-DDTHH:mm:ss.sssZ",其中 "T" 是日期和时间的分隔符,"Z" 表示时区。
例如,"2023-09-29T12:34:56Z" 表示 2023 年 9 月 29 日 12 时 34 分 56 秒的时间点。

2:日期字符串格式:常见的日期表示方法,通常是大家可读的形式展示。
格式可以是 "YYYY-MM-DD"(例如 "2023-09-29")、"MM/DD/YYYY"(例如 "09/29/2023")或 "DD/MM/YYYY"(例如 "29/09/2023")等。

3:时间戳:
时间戳是指从某个固定的起点(通常是 Unix 时间的起点,即 1970 年 1 月 1 日 00:00:00 UTC)以来经过的毫秒数、秒数或其他单位数。整数形式表示。

4:24 小时制时间:
以小时、分钟和秒为单位,使用 24 小时制。例如,"12:34:56" 表示 12 时 34 分 56 秒。

5:AM/PM 时间:
使用 12 小时制,并在时间后面加上 "AM" 或 "PM" 表示上午或下午。例如,"12:34:56 PM" 表示下午 12 时 34 分 56 秒。

在处理时间时,根据需要选择适当的格式进行表示和解析。

1:如何将日期字符串转换为时间戳?
在JavaScript中,可以使用Date对象和其相关方法将日期字符串转换为时间戳。下面是一个示例代码:

const dateString='2021-09-08'; // 替换为您的日期字符串

const date=new Date(dateString);
const timestamp=date.getTime();

console.log(timestamp); // 输出时间戳,例如:1631107200000

使用Date对象将日期字符串转换为日期对象,然后使用getTime()方法获取该日期对象的时间戳。

2:如何将时间戳转日期字符串格式?
在JavaScript中,可以使用Date对象和其相关方法将时间戳转换为日期字符串。下面是一个示例代码:

const timestamp=1631107200000; // 替换为您的时间戳

const date=new Date(timestamp);
const year=date.getFullYear();
const month=String(date.getMonth() + 1).padStart(2, '0');
const day=String(date.getDate()).padStart(2, '0');
const dateString=`${year}-${month}-${day}`;

console.log(dateString); // 输出日期字符串,例如:2021-09-08

使用Date对象的getFullYear()、getMonth()和getDate()方法来获取年、月和日,并使用padStart()方法来确保月份和日期为两位数。

3:如何获取时间戳中的年、月、日,小时、分钟和秒?

使用Date对象的相关方法来获取这些信息。下面是一个示例代码:

const timestamp=1631109035000; // 替换为您的时间戳

const date=new Date(timestamp);
const year=date.getFullYear();
const month=String(date.getMonth() + 1).padStart(2, '0');
const day=String(date.getDate()).padStart(2, '0');
const hours=String(date.getHours()).padStart(2, '0');
const minutes=String(date.getMinutes()).padStart(2, '0');
const seconds=String(date.getSeconds()).padStart(2, '0');

console.log(year, month, day, hours, minutes, seconds);

使用Date对象的getFullYear()、getMonth()、getDate()、getHours()、getMinutes()和getSeconds()方法来获取这些信息,并使用padStart()方法来确保它们为两位数。

avaScript 日期

  • JS 数组迭代
  • JS 日期格式



实例

var d=new Date();

亲自试一试

Vue3 + TypeScript中,我们可以使用Element Plus组件库中的时间选择器组件来进行时间格式的转换。首先要了解的是,给定的时间格式"2023-05-25T16:00:00.000Z"是ISO8601标准格式,也称为世界标准时间(Coordinated Universal Time,缩写为UTC),因此我们需要对其进行转换。

1、时间格式转换

我们可以使用JavaScript中的Date对象来将ISO8601时间格式转换为本地时间格式。具体步骤如下:

const isoTime="2023-05-25T16:00:00.000Z";

const localTime=new Date(isoTime).toLocaleString(); // 转换为本地时间格式

console.log(localTime); // 输出结果:"2023/5/26 上午12:00:00"

在这个例子中,我们首先定义了一个ISO8601时间格式的字符串变量isoTime,然后使用new Date()将其转换为Date对象,接着使用toLocaleString()将其转换为本地时间格式。最后,我们将转换后的时间输出到控制台。

需要注意的是,由于本地时区的不同,同样的ISO8601时间格式在不同的地区转换出来的本地时间也会不同。因此,在实际应用中,我们需要先确定要转换的ISO8601时间格式所处的时区,然后再进行转换。

2、Element Plus时间选择器

在Vue3 + TypeScript中,我们可以使用Element Plus组件库中的时间选择器组件来进行时间格式的转换。具体步骤如下:

<el-date-picker

v-model="date"

type="datetime"

format="yyyy-MM-dd HH:mm:ss"

placeholder="请选择时间"

></el-date-picker>

在这个例子中,我们使用了Element Plus中的<el-date-picker>组件,并通过v-model将选择的时间绑定到Vue实例中的date变量上。type属性指定了时间选择器的类型为datetime,表示既可以选择日期,也可以选择时间。format属性指定了输出的时间格式为"yyyy-MM-dd HH:mm:ss",即年-月-日 时:分:秒的格式。placeholder属性指定了时间选择器的占位符文本为"请选择时间"。

3、完整示例代码

下面是一个完整的示例代码,其中包含了ISO8601时间格式的转换和Element Plus时间选择器的使用:

<template>

<div>

<el-date-picker

v-model="date"

type="datetime"

format="yyyy-MM-dd HH:mm:ss"

placeholder="请选择时间"

></el-date-picker>

<p>{{ date }}</p>

</div>

</template>

<script>

import { defineComponent, ref } from "vue";

export default defineComponent({

name: "TimePicker",

setup() {

const isoTime="2023-05-25T16:00:00.000Z";

const localTime=new Date(isoTime).toLocaleString("zh-CN", {

hour12: false,

timeZone: "Asia/Shanghai",

}); // 转换为本地时间格式

const date=ref(localTime);

return {

date,

};

},

});

</script>

在这个示例中,我们首先定义了一个ISO8601时间格式的字符串变量isoTime,然后使用new Date()将其转换为Date对象,并指定了本地时区为"Asia/Shanghai",最后使用toLocaleString()将其转换为本地时间格式。接着,我们使用Vue3中的ref函数将转换后的时间绑定到名为date的变量上,并通过<el-date-picker>组件进行显示。最后,我们在页面中输出了date变量的值,以便查看转换后的时间格式是否正确。

4、总结

通过以上步骤,我们可以使用Vue3 + TypeScript和Element Plus组件库来将ISO8601时间格式转换为本地时间格式,并在页面中进行显示。需要注意的是,在实际应用中,我们需要先确定要转换的ISO8601时间格式所处的时区,然后再进行转换,以避免转换出来的时间格式不正确。