用dayjs解析时间戳,我被提了bug

引言

前几天开发中突然接到测试提的一个 Bug,说我的时间组件显示异常。

我很诧异,这里初始化数据是后端返回的,我什么也没改,这bug提给我干啥。我去问后端:“这数据是不是有问题?”。后端答:“没问题啊,我们一直都是这么返回的时间戳,其他人用也没报错。”

于是,对比生产环境数据,我终于找到了问题根源:后端时间戳的类型,从 Number 静悄悄地变成了 String。

Bug原因

问题的原因,肯定就出现在时间数据解析上了,代码中,我统一用的dayjs做的时间解析。

如图,对时间戳的解析我都是这么写的

const time = dayjs(res.endTime).format('YYYY-MM-DD HH:mm:ss')

于是,我分别试了两种数据类型的解析方式:

  • 字符型
dayjs('175008959900').format('YYYY-MM-DD hh:mm:ss') // 1975-07-19 01:35:59
  • 数值型
dayjs(Number('175008959900')).format('YYYY-MM-DD HH:mm:ss') // 2025-07-17 06:59:59

看来,问题原因显而易见了:

由于后端返回的是字符串类型'175008959900'dayjs() 在处理字符串时,会尝试按“常见的日期字符串格式”进行解析(如 YYYY-MM-DDYYYYMMDD 等),并不会自动识别为时间戳。所以它不会把这个字符串当作毫秒时间戳来解析,而是直接失败(解析成无效日期),但 dayjs 会退化为 Unix epoch(1970 年)或给出错误结果,最终导致返回的是错误的时间。

如何避免此类问题

同dayjs一样,原生的 new Date() 在解析时间戳时也存在类似的问题,因此,不管是 Date 还是 dayjs,一律对后端返回的时间戳 Number(input) 兜底处理,永远不要信任它传的是数字还是字符串:

const ts = Number(res.endTime);
const date = new Date(ts);

思考

其实出现这个问题,除了后端更改时间戳类型,也在于我没有充分理解“时间戳”的含义。我一直以为时间戳就是一段字符或一段数字,因此,从来没有想过做任何兜底处理。那么,什么是时间戳?

时间戳(Timestamp) 是一种用来表示时间的数字,通常表示从某个“起点时刻”到某个指定时间之间所经过的时间长度。这个“起点”大多数情况下是 1970 年 1 月 1 日 00:00:00 UTC(Unix 纪元)

常见时间戳类型:

类型单位示例值说明
Unix 时间戳(秒)1750089599常见于后端接口、数据库存储
毫秒时间戳毫秒1750089599000JavaScript 常用,Date.now()

时间戳的意义:

  • 它是一个 绝对时间的数字化表示,可以跨语言、跨平台统一理解;
  • 更容易做计算:两个时间戳相减就能得到毫秒差值(时间间隔);
  • 更紧凑:比如比字符串 "2025-07-17 06:59:59" 更短,处理性能更高。

在 JavaScript 中的使用:

console.log(Date.now()); // 比如:1714729530000// 将时间戳转为日期
console.log(new Date(1750089599000)); // Thu Jul 17 2025 06:59:59 GMT+0800

关于我

一个热爱技术分享的资深前端工程师,技术栈为Vue、React、Threejs,当然对一些前沿的技术也比较感兴趣,如微前端、鸿蒙开发、油猴脚本开发等。
如果你对前端技术也充满热爱或者希望关注一些前沿技术,欢迎加群讨论~

当然,如果你有任何面试、工作上遇到的技术问题也都可以在群里提问,有时间我就会及时回答~

在这里插入图片描述

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

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

相关文章

DataAgent产品经理(数据智能方向)

DataAgent产品经理(数据智能方向) 一、核心岗位职责 AI智能体解决方案设计 面向工业/政务场景构建「数据-模型-交互」闭环,需整合多源异构数据(如传感器数据、业务系统日志)与AI能力(如大模型微调、知识图…

Ubuntu取消开机用户自动登录

注:配置前请先设置登录密码,不同显示管理器配置方法不同,可用命令查看:cat /etc/X11/default-display-manager 一、LightDM 显示管理器,关闭 Ubuntu 系统用户自动登录 查找自动登录配置文件,可以看到类似 a…

使用lighttpd和开发板进行交互

文章目录 🧠 一、Lighttpd 与开发板的交互原理1. 什么是 Lighttpd?2. 与开发板交互的方式? 🧾 二、lighttpd.conf 配置文件讲解⚠️ 注意事项: 📁 三、目录结构说明💡 四、使用 C 编写 CGI 脚本…

Apache IoTDB V2.0.3 发布|新增元数据导入导出脚本适配表模型功能

Release Announcement Version 2.0.3 Apache IoTDB V2.0.3 已经发布! V2.0.3 作为树表双模型正式版本,主要新增元数据导入导出脚本适配表模型、Spark 生态集成(表模型)、AINode 返回结果新增时间戳,表模型新增部分聚…

车辆检测算法在爆炸事故应急响应中的优化路径

视觉分析赋能车辆管控:以山东应急场景为例 背景:应急场景下的车辆管控痛点 近期山东多起爆炸事故暴露了应急响应中的车辆管理短板:消防车、救护车因违停车辆堵塞通道,违规车辆闯入事故核心区,传统监控系统依赖人工识别…

∑ 1/n 调和级数 是 发散的

为什么 ∑ 1 u \sum \frac{1}{u} ∑u1​(即 ∑ 1 n \sum \frac{1}{n} ∑n1​,通常称为调和级数)是发散的? ✅ 一、首先明确你问的是这个级数: ∑ n 1 ∞ 1 n \sum_{n1}^{\infty} \frac{1}{n} n1∑∞​n1​ 这个级数…

Android第十二次面试-多线程和字符串算法总结

多线程的创建与常见使用方法 ​一、多线程创建方式​ ​1. 继承Thread类​ class MyThread extends Thread {Overridepublic void run() {// 线程执行逻辑System.out.println(Thread.currentThread().getName() " is running");} }// 使用 MyThread thread new …

大模型调用数据库表实践:基于自然语言的SQL生成与数据查询系统

# 大模型调用数据库表实践:基于自然语言的SQL生成与数据查询系统 ## 一、背景与目标 在企业数据管理场景中,非技术人员(如业务人员、管理人员)常常需要通过数据库查询获取关键信息,但直接编写SQL语句存在技术门槛。传…

28 C 语言作用域详解:作用域特性(全局、局部、块级)、应用场景、注意事项

1 作用域简介 作用域定义了代码中标识符(如变量、常量、数组、函数等)的可见性与可访问范围,即标识符在程序的哪些位置能够被引用或访问。在 C 语言中,作用域主要分为三类: 全局作用域局部作用域块级作用域 需注意&am…

Tomcat运行比较卡顿进行参数调优

在Tomcat conf/catalina.bat或catalina.sh中 的最上面增加参数 1. 初步调整参数(缓解问题) set JAVA_OPTS -Xms6g -Xmx6g -Xmn3g # 增大新生代,减少对象过早晋升到老年代 -XX:MetaspaceSize256m -XX:MaxMetaspaceS…

WSL2 安装与Docker安装

注意:如没有科学上网请勿尝试,无法判断是否会因网络错误导致的安装失败!!! WSL2(Windows Subsystem for Linux 2) 功能简介: WSL2 是微软提供的在 Windows 上运行完整 Linux 内核的…

Redis的安装与使用

网址:Spring Data Redis 安装包:Releases tporadowski/redis GitHub 解压后 在安装目录中打开cmd 打开服务(注意:每次客户端连接都有先打开服务!!!) 按ctrlC退出服务 客户端连接…

springboot-响应接收与ioc容器控制反转、Di依赖注入

1.想将服务器中的数据返回给客户端,需要在controller类上加注解:ResponseBody; 这个注解其实在前面已经使用过,RestController其实就包含两个注解: Controller ResponseBody 返回值如果是实体对象/集合,将会转换为j…

将材质球中的纹理属性对应的贴图保存至本地

通过Texture2D的EncodeToPNG方法将纹理转为图片形式 material.GetTexture方法通过属性名获取纹理贴图 material.SetTexture方法通过属性名设置纹理贴图 属性名可在shader代码中查看 using UnityEngine; using System.IO;public class TextureSaver : MonoBehaviour {public…

MySQL半同步复制配置和参数详解

目录 1 成功配置主从复制 2 加载插件 3 半同步复制监控 4 半同步复制参数 1 成功配置主从复制 操作步骤参考:https://blog.csdn.net/zyb378747350/article/details/148309545 2 加载插件 #主库上 MySQL 8.0.26 之前版本: mysql>INSTALL PLUGIN rpl_semi_syn…

【笔记】Windows 成功部署 Suna 开源的通用人工智能代理项目部署日志

#工作记录 本地部署运行截图 kortix-ai/suna: Suna - 开源通用 AI 代理 项目概述 Suna 是一个完全开源的 AI 助手,通过自然对话帮助用户轻松完成研究、数据分析等日常任务。它结合了强大的功能和直观的界面,能够理解用户需求并提供结果。其强…

PCB制作入门

文章目录 1 嘉立创使用旋转 2元器件选择MP2315SLM7815与LM7915 1 嘉立创使用 旋转 空格旋转 2元器件选择 MP2315S MP2315S 是一款内置功率 MOSFET 的高效率同步整流降压开关变换器。 其输入电压范围为 4.5V 至 24V ,能实现 3A 连续输出电流,负载与…

2025——》NumPy中的np.logspace使用/在什么场景下适合使用np.logspace?NumPy中的np.logspace用法详解

1.NumPy中的np.logspace使用: 在 NumPy 中,np.logspace函数用于生成对数尺度上等间距分布的数值序列,适用于科学计算、数据可视化等需要对数间隔数据的场景。以下是其核心用法和关键细节: 一、基础语法与参数解析: numpy.logspace(start, stop, num=50, endpoint=True, ba…

Java实现中文姓名转拼音生成用户信息并写入文件

中文姓名转拼音 Java实现中文姓名转拼音生成用户信息并写入文件(shili域名版)一、项目背景与功能简介二、技术栈与核心组件2.1 主要技术2.2 功能模块 三、核心代码解析3.1 主函数逻辑(流程控制)3.2 拼音转换模块(核心功…

Google car key:安全、便捷的汽车解锁新选择

有了兼容的汽车和 Android 手机,Google car key可让您将Android 手机用作车钥匙。您可以通过兼容的 Android 手机锁定、解锁、启动汽车并执行更多功能。但是,Google car key安全吗?它是如何工作的?如果我的手机电池没电了怎么办&a…