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

news2025/4/14 3:50:40

如何在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);

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1647915.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

运维自动化之 ansible

目录 一 常见的自动化运维工具 (一)有哪些常见的 自动化运维工具 (二)为什么后面都变成用 ansible 二 ansible 基本介绍 1, ansible 是什么 2,ansible能干什么 3,ansible 工作原…

RTD2795T显示芯片触控Touch菜单OSD

RTD显示芯片使用串口Uart接收触摸屏过来的坐标点信息,在菜单OSD上进行触控操作。 RTD全系列显示芯片触控Touch菜单OSD-易显LCD显示方案设计RTD显示器LCD驱动方案设计http://rtddisplay.com/NewsDetail.aspx?id127

动态规划-两个数组的dp问题2

文章目录 1. 不同的子序列(115)2. 通配符匹配(44) 1. 不同的子序列(115) 题目描述: 状态表示: 根据题意这里的dp数组可以定义为二维,并且dp[i][j]表示字符串t的0到i的…

C++ 概览并发

并发 资源管理 资源 程序中符合先获取后释放(显式或隐式)规律的东西,比如内存、锁、套接字、线程句柄和文件句柄等。RAII: (Resource Acquisition Is Initialization),也称为“资源获取就是初始化”,是C语言的一种管…

华为AI全栈生态布局:中国科技巨头加速创新

华为AI芯片生态全栈深度分析 2024 一、引言 1.1 华为AI芯片发展背景: 华为,通信和消费电子巨头,以其技术创新和远见著称。2013年,华为率先布局人工智能(AI),并专注于全栈AI解决方案的开发。华…

微信小程序15: 小程序组件

创建组件 ①在项目的根目录中,鼠标右键,创建components -> test文件夹 ②在新建的components -> test文件夹上,鼠标右键,点击“新建Component‘ ③键入组件的名称之后回车,会自动生成组件对应的4个文件&#…

继承知识及扩展(C++)

1. 继承是什么? 继承是面向对象编程的三大特征之一,也是代码复用的手段之一。之前我们在很多的地方尝试函数的复用,而继承是为了类的复用提供了很好的方式。 (1)继承的代码怎么写 在一个类后面使用 :继承方…

JMeter - 如何测试REST API / 微服务

概述: 有许多方法和工具可用于测试REST API。 当我需要测试REST API时,在查看了各种工具和选项之后,由于以下原因,我选择了JMeter。 JMeter是免费和开源的。 JMeter可以从CSV文件中直接读取您的测试数据。参数化非常简单。 可以…

基于SWIFT框架的Phi-3推理、微调实战教程

近期, Microsoft 推出 Phi-3,这是 Microsoft 开发的一系列开放式 AI 模型。Phi-3 模型是一个功能强大、成本效益高的小语言模型 (SLM),在各种语言、推理、编码和数学基准测试中,在同级别参数模型中性能表现优秀。为开发者构建生成…

零基础自学网络安全/Web安全(超详细入门到进阶)学完即可就业(含学习笔记)

一、为什么选择网络安全? 这几年随着我国《国家网络空间安全战略》《网络安全法》《网络安全等级保护2.0》等一系列政策/法规/标准的持续落地,网络安全行业地位、薪资随之水涨船高。 未来3-5年,是安全行业的黄金发展期,提前踏入…

ICode国际青少年编程竞赛- Python-1级训练场-变量练习

ICode国际青少年编程竞赛- Python-1级训练场-变量练习 1、 a 8 for i in range(8):Dev.step(a)Dev.turnRight()a - 12、 a 3 for i in range(4):Dev.step(a)Dev.turnRight()a a 1 Dev.step(5)3、 a 4 for i in range(4):Dev.step(2)Dev.step(-5)Dev.step(3)Spaceship.…

一次性邮箱API发送邮件的方法?如何配置?

一次性邮箱API发送邮件有哪些注意事项?怎么安全发信? 随着网络安全问题的日益凸显,如何安全、高效地发送邮件成为了一个亟待解决的问题。一次性邮箱API的出现,为我们提供了一种新的解决方案。那么,如何使用一次性邮箱…

在uni-app开发的小程序中引入阿里的多色图标

uniapp不支持阿里多色图标,需要使用工具iconfont-tools进行处理 1.首先 在阿里图标库将 需要的图标添加到项目中 并下载压缩包,取出iconfont.js文件 2.安装iconfont-tools,安装完成会显示出安装到了电脑的那个目录 3,进入目录就会看到下面的…

【Unity动画系统】动画层级(Animation Layer)讲解与使用

如何使用Unity的Animation Layer和Avater Mask把多个动画组合使用 想让玩家持枪行走,但是手里只有行走和持枪站立的动作。 Unity中最方便的解决办法就是使用动画层级animation layer以及替身蒙版avatar mask。 创建一个动画层级 Weight表示权重,0的话则…

MFC扩展库BCGControlBar Pro v34.1 - 可视化设计器、主题新升级

BCGControlBar库拥有500多个经过全面设计、测试和充分记录的MFC扩展类。 我们的组件可以轻松地集成到您的应用程序中,并为您节省数百个开发和调试时间。 BCGControlBar专业版 v34.1已正式发布了,这个版本包含了对Windows 10/11字体图标的支持、功能区和…

国内小白用什么方法充值使用ChatGPT4.0?

首先说一下IOS礼品卡订阅,目前最经济实惠的订阅方式,具体操作步骤 使用IOS设备充值,用 App Stroe 兑换券 1、支付宝地址切换旧金山,在里面买app store 的兑换卷 2、美区Apple ID登陆app store ,充值兑换券 3、IOS设…

AI 数据观 | TapData Cloud + MongoDB Atlas:大模型与 RAG 技术有机结合,落地实时工单处理智能化解决方案

本篇为「AI 数据观」系列文章第二弹,在这里,我们将进一步探讨 AI 行业的数据价值。以 RAG 的智能工单应用场景为例,共同探索如何使用 Tapdata Cloud MongoDB Atlas 实现具备实时更新能力的向量数据库,为企业工单处理的智能化和自…

7款AI绘画软件推荐,必备工具,一键生成绘画

随着人工智能技术的不断发展,AI绘画软件在艺术创作中扮演着越来越重要的角色。这些软件利机器学习和深度学习算法,可以模仿艺术家的风格,并生成逼真的绘画作品。一起来见证下吧,先给大家展示下AI绘画生成的效果图: 一、…

边界框(bounding box) 目标物体的位置和大小 交并比(Intersection over Union,IoU) 锚框(Anchor box)

边界框(bounding box) 在检测任务中,我们需要同时预测物体的类别和位置,因此需要引入一些跟位置相关的概念。通常使用边界框(bounding box,bbox)来表示物体的位置,边界框是正好能包含物体的矩形框。 在目标检测任务中,边界框(bounding box,bbox)是一个非常重要的…

RS232/RS485转12路模拟信号隔离D/A转换器4-20mA0-20mA0-25mA0-5V0-10V0-75mV

特点: ● RS-485/232接口,隔离转换成12路标准模拟信号输出 ● 可选型输出4-20mA或0-10V控制其他设备 ● 模拟信号输出精度优于 0.2% ● 可以程控校准模块输出精度 ● 信号输出 / 通讯接口之间隔离耐压3000VDC ● 宽电源供电范围:10 ~ …