当前位置:首页 > JavaScript

js实现dateformat

2026-01-31 21:53:04JavaScript

JavaScript 实现日期格式化

在 JavaScript 中,Date 对象没有内置的格式化方法,但可以通过多种方式实现日期格式化。以下是几种常见的实现方法:

使用原生方法组合

通过 Date 对象的原生方法(如 getFullYeargetMonth 等)组合实现格式化:

js实现dateformat

function formatDate(date, format = 'YYYY-MM-DD') {
  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');

  return format
    .replace('YYYY', year)
    .replace('MM', month)
    .replace('DD', day)
    .replace('HH', hours)
    .replace('mm', minutes)
    .replace('ss', seconds);
}

// 使用示例
const today = new Date();
console.log(formatDate(today)); // 输出如 "2023-11-15"
console.log(formatDate(today, 'YYYY/MM/DD HH:mm:ss')); // 输出如 "2023/11/15 14:30:45"

使用 Intl.DateTimeFormat

Intl.DateTimeFormat 是 JavaScript 内置的国际化 API,可以方便地格式化日期:

js实现dateformat

function formatDate(date, locale = 'en-US', options = {}) {
  return new Intl.DateTimeFormat(locale, options).format(date);
}

// 使用示例
const today = new Date();
console.log(formatDate(today)); // 默认输出如 "11/15/2023"
console.log(formatDate(today, 'en-US', { 
  year: 'numeric', 
  month: 'long', 
  day: 'numeric' 
})); // 输出如 "November 15, 2023"

使用第三方库

如果需要更复杂的格式化功能,可以使用第三方库如 date-fnsmoment.js(后者已不再推荐):

// 使用 date-fns
import { format } from 'date-fns';

const today = new Date();
console.log(format(today, 'yyyy-MM-dd')); // 输出如 "2023-11-15"
console.log(format(today, 'MM/dd/yyyy HH:mm:ss')); // 输出如 "11/15/2023 14:30:45"

自定义格式化函数

如果需要完全自定义的格式化逻辑,可以扩展 Date 原型或编写独立函数:

Date.prototype.format = function(format) {
  const map = {
    'YYYY': this.getFullYear(),
    'MM': String(this.getMonth() + 1).padStart(2, '0'),
    'DD': String(this.getDate()).padStart(2, '0'),
    'HH': String(this.getHours()).padStart(2, '0'),
    'mm': String(this.getMinutes()).padStart(2, '0'),
    'ss': String(this.getSeconds()).padStart(2, '0'),
  };

  return format.replace(/YYYY|MM|DD|HH|mm|ss/g, match => map[match]);
};

// 使用示例
const today = new Date();
console.log(today.format('YYYY-MM-DD')); // 输出如 "2023-11-15"

注意事项

  • 月份从 0 开始计数(0 表示一月),因此需要 +1
  • 使用 padStart 确保数字位数一致(如 1 变为 01)。
  • 国际化场景下优先使用 Intl.DateTimeFormat
  • 避免扩展原生原型(如 Date.prototype),可能与其他库冲突。

标签: jsdateformat
分享给朋友:

相关文章

js 实现vue

js 实现vue

实现 Vue 的核心功能 在 JavaScript 中实现 Vue 的核心功能需要模拟数据绑定、虚拟 DOM 和响应式系统。以下是一个简化版的实现思路: 响应式系统 通过 Object.define…

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previo…

js实现图片预览

js实现图片预览

使用FileReader API实现图片预览 通过FileReader对象读取用户选择的图片文件并显示预览: const input = document.getElementById('image…

js实现图片放大缩小

js实现图片放大缩小

实现图片放大缩小的基础方法 使用CSS的transform: scale()属性可以快速实现图片的放大缩小效果。通过JavaScript动态修改该属性值: const img = document.…

jquery.js

jquery.js

jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互等操作。以下是关于 jQuery.js 的核心信息和使用方法: 获取 jQ…

js实现自举

js实现自举

实现 JavaScript 自举的方法 JavaScript 自举(Bootstrap)通常指通过 JavaScript 动态加载自身或依赖的脚本,实现运行时环境的初始化或扩展。以下是几种常见实现方式…