小程序日期格式化的实用方法全解

在小程序开发中，日期格式化是指将JavaScript的Date对象转换为符合特定区域习惯和展示需求的字符串的过程。由于不同地区对日期格式的要求各异，例如中国常用“年-月-日”，而欧美国家常用“月/日/年”，因此掌握日期格式化技巧至关重要。

JavaScript内置的Date对象提供了丰富的日期时间信息，但其默认的toString方法返回的格式往往不符合展示要求。小程序中通常需要借助工具函数或第三方库来实现灵活的格式化。

使用原生JavaScript进行格式化

虽然JavaScript没有内置的格式化方法，但可以通过Date对象的方法组合实现基本格式化：

function formatDate(date) {
const year = date.getFullYear;
const month = String(date.getMonth + 1).padStart(2, '0');
const day = String(date.getDate).padStart(2, '0');
return `${year}-${month}-${day}`;
}

这种方法简单直接，但功能有限。对于更复杂的需求，如星期、季度等显示，代码会变得冗长：

function formatFullDate(date) {
const weekDays = ['日', '一', '二', '三', '四', '五', '六'];
const year = date.getFullYear;
const month = String(date.getMonth + 1).padStart(2, '0');
const day = String(date.getDate).padStart(2, '0');
const weekDay = weekDays[date.getDay];
return `${year}年${month}月${day}日 星期${weekDay}`;
}

利用小程序内置方法

小程序提供了更便捷的日期处理方式。通过WXS（WeiXin Script）可以在WXML中直接格式化日期：

function formatTime(date, format) {
var year = date.getFullYear
var month = date.getMonth + 1
var day = date.getDate
if (format === 'YYYY-MM-DD') {
return [year, month, day].map(formatNumber).join('-')
} else if (format === 'YYYY年MM月DD日') {
return year + '年' + formatNumber(month) + '月' + formatNumber(day) + '日'
function formatNumber(n) {
n = n.toString
return n[1] ? n : '0' + n
module.exports = {
formatTime: formatTime

在WXML中使用：{{dateUtils.formatTime(date, 'YYYY-MM-DD')}}

moment.js在小程序中的应用

Moment.js是知名的日期处理库，虽然官方不推荐在新项目中使用，但在现有项目中仍有广泛应用。在小程序中使用Moment.js：

// 安装moment.js后
const moment = require('../../lib/moment.min.js')
Page({
currentTime: moment.format('YYYY-MM-DD HH:mm:ss'),
relativeTime: moment.startOf('hour').fromNow
})

常用格式化示例：

• moment.format('YYYY-MM-DD') → 2023-05-15
• moment.format('YYYY年MM月DD日 HH:mm') → 2023年05月15日 14:30
• moment.format('dddd') → 星期一

day.js轻量级替代方案

Day.js是Moment.js的轻量级替代品，API与Moment.js高度兼容，但体积只有2KB左右，更适合小程序环境：

const dayjs = require('../../lib/dayjs.min.js')
// 基本使用
dayjs.format('YYYY-MM-DD')
dayjs.format('YYYY/MM/DD HH:mm:ss')
// 相对时间
dayjs('2023-05-15').fromNow
// 多语言支持
const localizedFormat = require('../../lib/dayjs.localizedFormat.min.js')
dayjs.extend(localizedFormat)

Day.js支持插件系统，可以根据需要引入特定功能，避免打包体积过大。

自定义格式化函数库

针对小程序的特殊需求，可以封装一个完整的日期格式化工具库：

class DateFormatter {
static format(date, formatStr) {
const obj = {
'Y+': date.getFullYear,
'M+': date.getMonth + 1,
'D+': date.getDate,
'H+': date.getHours,
'm+': date.getMinutes,
's+': date.getSeconds,
'q+': Math.floor((date.getMonth + 3) / 3),
'S': date.getMilliseconds
for (let k in obj) {
const reg = new RegExp(`(${k})`)
if (reg.test(formatStr)) {
const str = String(obj[k])
formatStr = formatStr.replace(reg, (match, p1) => {
return p1.length === 1 ? str : this.padZero(str, p1.length)
})
return formatStr
static padZero(str, length) {
return ('00' + str).slice(-length)
static getWeekDay(date, prefix = '星期') {
const weekDays = ['日', '一', '二', '三', '四', '五', '六']
return prefix + weekDays[date.getDay]
}

常见格式化模式对照表

实战技巧与性能优化

在实际开发中，日期格式化需要注意以下要点：

• 缓存格式化结果：对于不频繁变化的日期，避免重复格式化
• 选择合适的工具：简单需求用原生方法，复杂需求用Day.js
• 时区处理：国际化小程序需要妥善处理时区差异
• 内存优化：避免在频繁调用的函数中创建新的Date对象

性能优化示例：

// 不好的做法
每次调用都创建新对象
function getCurrentTime {
return new Date.toLocaleString
// 好的做法
适当缓存
let cachedTime = null
let lastUpdate = 0
function getCachedTime {
const now = Date.now
if (now
lastUpdate > 1000) { // 每秒更新一次
cachedTime = new Date.toLocaleString
lastUpdate = now
return cachedTime
}