如何在JavaScript/Vue中获取当前时间并格式化输出(精确到时分秒)

本文主要是介绍如何在JavaScript/Vue中获取当前时间并格式化输出(精确到时分秒),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

如何在JavaScript/Vue中获取当前时间并格式化输出(精确到时分秒)

在这里插入图片描述

不只是树,人也是一样,在不确定中生活的人,能比较经得起生活的考验,会锻炼出一颗独立自主的心。在不确定中,就能学会把很少的养分转化为巨大的能量,努力生长。
——林清玄 《桃花心木》

获取当前时间

在JavaScript中,Date对象是处理日期和时间的主要方式。要获取当前的日期和时间,你可以简单地创建一个新的Date实例:

const now = new Date();

这个now对象包含了你执行代码时的准确日期和时间。

分解时间成分

要格式化日期时间,首先需要从Date对象中提取出年、月、日、时、分和秒。可以通过以下方法获取:

const year = now.getFullYear();  // 获取年份
const month = String(now.getMonth() + 1).padStart(2, '0');  // 获取月份,月份从0开始所以要+1
const date = String(now.getDate()).padStart(2, '0');  // 获取日期
const hours = String(now.getHours()).padStart(2, '0');  // 获取小时
const minutes = String(now.getMinutes()).padStart(2, '0');  // 获取分钟
const seconds = String(now.getSeconds()).padStart(2, '0');  // 获取秒钟

注意这里使用了String().padStart(2, '0')来确保每个时间部分都是双位数的格式,例如将9转换为09

格式化输出

一旦有了这些分解出来的时间成分,就可以按照需要将它们组合成任何格式。以下是一些常见的格式化输出方式:

ISO 8601格式(国际标准格式):

const isoFormat = `${year}-${month}-${date}T${hours}:${minutes}:${seconds}`;
console.log(isoFormat);

美式格式(AM/PM制):

const amPm = hours >= 12 ? 'PM' : 'AM';
const formattedHours = ((hours % 12) || 12).toString().padStart(2, '0');  // 将24小时制转换为12小时制
const usFormat = `${month}/${date}/${year} ${formattedHours}:${minutes}:${seconds} ${amPm}`;
console.log(usFormat);

简单的数字格式:

const simpleFormat = `${date}/${month}/${year} ${hours}:${minutes}:${seconds}`;
console.log(simpleFormat);

这篇关于如何在JavaScript/Vue中获取当前时间并格式化输出(精确到时分秒)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/966935

相关文章

Spring Boot整合Redis注解实现增删改查功能(Redis注解使用)

《SpringBoot整合Redis注解实现增删改查功能(Redis注解使用)》文章介绍了如何使用SpringBoot整合Redis注解实现增删改查功能,包括配置、实体类、Repository、Se... 目录配置Redis连接定义实体类创建Repository接口增删改查操作示例插入数据查询数据删除数据更

Java Lettuce 客户端入门到生产的实现步骤

《JavaLettuce客户端入门到生产的实现步骤》本文主要介绍了JavaLettuce客户端入门到生产的实现步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要... 目录1 安装依赖MavenGradle2 最小化连接示例3 核心特性速览4 生产环境配置建议5 常见问题

Java使用Swing生成一个最大公约数计算器

《Java使用Swing生成一个最大公约数计算器》这篇文章主要为大家详细介绍了Java使用Swing生成一个最大公约数计算器的相关知识,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下... 目录第一步:利用欧几里得算法计算最大公约数欧几里得算法的证明情形 1:b=0情形 2:b>0完成相关代码第二步:加

Java 的ArrayList集合底层实现与最佳实践

《Java的ArrayList集合底层实现与最佳实践》本文主要介绍了Java的ArrayList集合类的核心概念、底层实现、关键成员变量、初始化机制、容量演变、扩容机制、性能分析、核心方法源码解析、... 目录1. 核心概念与底层实现1.1 ArrayList 的本质1.1.1 底层数据结构JDK 1.7

Java Map排序如何按照值按照键排序

《JavaMap排序如何按照值按照键排序》该文章主要介绍Java中三种Map(HashMap、LinkedHashMap、TreeMap)的默认排序行为及实现按键排序和按值排序的方法,每种方法结合实... 目录一、先理清 3 种 Map 的默认排序行为二、按「键」排序的实现方式1. 方式 1:用 TreeM

Java中流式并行操作parallelStream的原理和使用方法

《Java中流式并行操作parallelStream的原理和使用方法》本文详细介绍了Java中的并行流(parallelStream)的原理、正确使用方法以及在实际业务中的应用案例,并指出在使用并行流... 目录Java中流式并行操作parallelStream0. 问题的产生1. 什么是parallelS

Java中Redisson 的原理深度解析

《Java中Redisson的原理深度解析》Redisson是一个高性能的Redis客户端,它通过将Redis数据结构映射为Java对象和分布式对象,实现了在Java应用中方便地使用Redis,本文... 目录前言一、核心设计理念二、核心架构与通信层1. 基于 Netty 的异步非阻塞通信2. 编解码器三、

SpringBoot基于注解实现数据库字段回填的完整方案

《SpringBoot基于注解实现数据库字段回填的完整方案》这篇文章主要为大家详细介绍了SpringBoot如何基于注解实现数据库字段回填的相关方法,文中的示例代码讲解详细,感兴趣的小伙伴可以了解... 目录数据库表pom.XMLRelationFieldRelationFieldMapping基础的一些代

一篇文章彻底搞懂macOS如何决定java环境

《一篇文章彻底搞懂macOS如何决定java环境》MacOS作为一个功能强大的操作系统,为开发者提供了丰富的开发工具和框架,下面:本文主要介绍macOS如何决定java环境的相关资料,文中通过代码... 目录方法一:使用 which命令方法二:使用 Java_home工具(Apple 官方推荐)那问题来了,

Java HashMap的底层实现原理深度解析

《JavaHashMap的底层实现原理深度解析》HashMap基于数组+链表+红黑树结构,通过哈希算法和扩容机制优化性能,负载因子与树化阈值平衡效率,是Java开发必备的高效数据结构,本文给大家介绍... 目录一、概述:HashMap的宏观结构二、核心数据结构解析1. 数组(桶数组)2. 链表节点(Node