动态格式化时间

需求

很多时候我们都需要对时间进行格式化的处理,不同的模块可能需要不同的时间格式甚至是不同的时间长度。

我认为最合理的处理时间的方式是在存储的时候存储时间戳,这样方便今后转换为任何时间格式,然后我简单封装了一个时间格式的处理方法,支持我们获取任意长度,任意格式的时间

格式时间

  • 年: YYYY
  • 月: M/MM (双字符长度代表自动补0)
  • 日: D/DD
  • 时: h/hh
  • 分: m/mm
  • 秒: s/ss
  • 季度: Q 我们可以采取任何时间场地或任何形式进行拼接,例如:YYYY-MM-DD hh-mm-ss或者YYYY年MM月,该方法会自动识别其中的时间字段进行替换,从而保留其他拼接字符,注意不要使用代表时间格式的字符进行接
js 复制代码
const formatDate = (
    dateTemplate = "YYYY-MM-DD hh:mm:ss",
    date = new Date()
    ) => {
    try {
      // 处理日期输入,转换为Date对象
      let targetDate;
      if (date instanceof Date) {
        targetDate = date;
      } else {
        targetDate = new Date(date);
      }

      // 检查日期有效性
      if (isNaN(targetDate.getTime())) {
        throw new Error("您传入的不是有效的日期格式!");
      }

      // 提取日期组件
      const year = targetDate.getFullYear();
      const month = targetDate.getMonth() + 1;
      const dateNum = targetDate.getDate();
      const hours = targetDate.getHours();
      const minutes = targetDate.getMinutes();
      const seconds = targetDate.getSeconds();
      const quarter = Math.floor(month / 3) + 1;

      // 定义替换规则映射表
      const replacements = {
        YYYY: year,
        MM: String(month).padStart(2, "0"),
        M: month,
        DD: String(dateNum).padStart(2, "0"),
        D: dateNum,
        hh: String(hours).padStart(2, "0"),
        h: hours,
        mm: String(minutes).padStart(2, "0"),
        m: minutes,
        ss: String(seconds).padStart(2, "0"),
        s: seconds,
        Q: quarter, // 新增季度支持
      };

      // 执行替换
      return Object.entries(replacements).reduce((str, [key, value]) => {
        return str.replace(new RegExp(key, "g"), value);
      }, dateTemplate);
    } catch (error) {
      console.error("日期格式化错误:", error.message);
      return null; // 明确返回null表示格式化失败
    }
};
相关推荐
方也_arkling11 分钟前
Element Plus主题色定制
javascript·sass
2601_9498095933 分钟前
flutter_for_openharmony家庭相册app实战+我的Tab实现
java·javascript·flutter
Up九五小庞43 分钟前
开源埋点分析平台 ClkLog 本地部署 + Web JS 埋点测试实战--九五小庞
前端·javascript·开源
摘星编程1 小时前
React Native + OpenHarmony:UniversalLink通用链接
javascript·react native·react.js
qq_177767371 小时前
React Native鸿蒙跨平台数据使用监控应用技术,通过setInterval每5秒更新一次数据使用情况和套餐使用情况,模拟了真实应用中的数据监控场景
开发语言·前端·javascript·react native·react.js·ecmascript·harmonyos
烬头88212 小时前
React Native鸿蒙跨平台应用实现了onCategoryPress等核心函数,用于处理用户交互和状态更新,通过计算已支出和剩余预算
前端·javascript·react native·react.js·ecmascript·交互·harmonyos
程序员清洒3 小时前
Flutter for OpenHarmony:Text — 文本显示与样式控制
开发语言·javascript·flutter
雨季6664 小时前
Flutter 三端应用实战:OpenHarmony 简易“动态内边距调节器”交互模式深度解析
javascript·flutter·ui·交互·dart
会飞的战斗鸡4 小时前
JS中的链表(含leetcode例题)
javascript·leetcode·链表
方也_arkling5 小时前
别名路径联想提示。@/统一文件路径的配置
前端·javascript