IT评测·应用市场-qidao123.com
标题:
前端TS 时间格式化函数
[打印本页]
作者:
用多少眼泪才能让你相信
时间:
2025-3-2 14:50
标题:
前端TS 时间格式化函数
/**
* 时间日期转换
* @param date 当前时间,new Date() 格式
* @param format 需要转换的时间格式字符串
* @returns 返回拼接后的时间字符串
*/
export function formatDate(date: Date, format: string): string {
const week: { [key: string]: string } = {
'0': '日', '1': '一', '2': '二', '3': '三', '4': '四', '5': '五', '6': '六',
};
const quarter: { [key: string]: string } = { '1': '一', '2': '二', '3': '三', '4': '四' };
const we = date.getDay(); // 星期
const z = getWeek(date); // 周
const qut = Math.floor((date.getMonth() + 3) / 3).toString(); // 季度
const opt: { [key: string]: string } = {
'Y+': date.getFullYear().toString(),
'm+': (date.getMonth() + 1).toString(),
'd+': date.getDate().toString(),
'H+': date.getHours().toString(),
'M+': date.getMinutes().toString(),
'S+': date.getSeconds().toString(),
'q+': quarter[qut], // 季度
};
// 处理格式中的特殊标记
format = format.replace(/(W+)/, (match) => match.length > 1 ? `周${week[we]}` : week[we]);
format = format.replace(/(Q+)/, (match) => match.length === 4 ? `第${quarter[qut]}季度` : quarter[qut]);
format = format.replace(/(Z+)/, (match) => match.length === 3 ? `第${z}周` : `${z}`);
// 替换日期格式中的部分
Object.keys(opt).forEach((key) => {
const reg = new RegExp(`(${key})`);
format = format.replace(reg, (match) => match.length === 1 ? opt[key] : opt[key].padStart(match.length, '0'));
});
return format;
}
/**
* 获取当前日期是第几周
* @param dateTime 当前传入的日期值
* @returns 返回第几周数字值
*/
export function getWeek(dateTime: Date): number {
const temptTime = new Date(dateTime);
const weekday = temptTime.getDay() || 7; // 周几 (0-6,0代表星期天)
// 调整日期到上周一
temptTime.setDate(temptTime.getDate() - weekday + 1);
const firstDay = new Date(temptTime.getFullYear(), 0, 1);
// 获取第一周的第一天
const dayOfWeek = firstDay.getDay();
const spendDay = dayOfWeek === 0 ? 7 : 7 - dayOfWeek + 1;
// 计算周数
const startOfYear = new Date(temptTime.getFullYear(), 0, 1 + spendDay);
const days = Math.ceil((temptTime.getTime() - startOfYear.getTime()) / 86400000);
return Math.ceil(days / 7);
}
/**
* 将时间转换为 `几秒前`、`几分钟前`、`几小时前`、`几天前`
* @param param 当前时间,new Date() 格式或者字符串时间格式
* @param format 需要转换的时间格式字符串
* @returns 返回拼接后的时间字符串
*/
export function formatPast(param: string | Date, format: string = 'YYYY-mm-dd'): string {
const time = new Date().getTime();
let t = typeof param === 'string' || param instanceof Date ? new Date(param).getTime() : param;
const diff = time - t;
if (diff < 10000) return '刚刚'; // 10秒内
if (diff < 60000) return `${Math.floor(diff / 1000)}秒前`; // 少于1分钟
if (diff < 3600000) return `${Math.floor(diff / 60000)}分钟前`; // 少于1小时
if (diff < 86400000) return `${Math.floor(diff / 3600000)}小时前`; // 少于24小时
if (diff < 259200000) return `${Math.floor(diff / 86400000)}天前`; // 少于3天
return formatDate(new Date(param), format); // 超过3天
}
/**
* 时间问候语
* @param param 当前时间,new Date() 格式
* @returns 返回拼接后的时间字符串
*/
export function formatAxis(param: Date): string {
const hour = new Date(param).getHours();
if (hour < 6) return '凌晨好';
if (hour < 9) return '早上好';
if (hour < 12) return '上午好';
if (hour < 14) return '中午好';
if (hour < 17) return '下午好';
if (hour < 19) return '傍晚好';
if (hour < 22) return '晚上好';
return '夜里好';
}
/**
* 日期格式化 (更简洁,兼容字符串和时间戳)
* @param time 当前时间,string | number | Date
* @param pattern 格式字符串
* @returns 格式化后的日期字符串
*/
export function parseTime(time: string | number | Date, pattern: string = '{y}-{m}-{d} {h}:{i}:{s}'): string {
const date = new Date(time);
const formatObj = {
y: date.getFullYear(),
m: date.getMonth() + 1,
d: date.getDate(),
h: date.getHours(),
i: date.getMinutes(),
s: date.getSeconds(),
a: date.getDay(),
};
return pattern.replace(/{(y|m|d|h|i|s|a)+}/g, (match, key) => {
let value = formatObj[key];
if (key === 'a') {
return ['日', '一', '二', '三', '四', '五', '六'][value];
}
return value.toString().padStart(match.length, '0');
});
}
/**
* 日期格式化 (仅年月日)
* @param time 当前时间,string | number | Date
* @param pattern 格式字符串
* @returns 格式化后的日期字符串
*/
export function parseDate(time: string | number | Date, pattern: string = '{y}-{m}-{d}'): string {
return parseTime(time, pattern);
}
export const dateTimeStr: string = 'YYYY-MM-DD HH:mm:ss';
export const dateStr: string = 'YYYY-MM-DD';
export const timeStr: string = 'HH:mm:ss';
复制代码
1.
formatDate
- 时间日期转换
方法作用:
根据传入的 Date 对象和指定的时间格式,返回格式化后的时间字符串。支持 YYYY, MM, DD, HH, MM, SS 等格式化符号,还可以格式化季度 (Q)、星期 (W) 和几周 (Z)。
参数:
date:Date 对象(比方:new Date())。
format:格式字符串,可以包罗以下字符:
YYYY: 年(比方:2024)
MM: 月(比方:01)
DD: 日(比方:01)
HH: 小时(比方:12)
mm: 分钟(比方:30)
SS: 秒(比方:45)
W: 星期(比方:周一,星期一等)
Q: 季度(比方:第1季度)
Z: 周数(比方:第12周)
返回值:
格式化后的日期字符串。
示例:
const date = new Date();
const format1 = 'YYYY-MM-DD';
console.log(formatDate(date, format1)); // 输出:2024-01-17
const format2 = 'YYYY-MM-DD HH:mm:ss';
console.log(formatDate(date, format2)); // 输出:2024-01-17 12:30:45
const format3 = 'YYYY-MM-DD HH:mm:ss QQQQ';
console.log(formatDate(date, format3)); // 输出:2024-01-17 12:30:45 第1季度
复制代码
2.
getWeek
- 获取当前日期是第几周
方法作用:
根据传入的日期,返回该日期是当前年份的第几周。
参数:
dateTime:Date 对象(比方:new Date())。
返回值:
当前日期是第几周(数字情势)。
示例:
const date = new Date('2024-01-17');
console.log(getWeek(date)); // 输出:3,表示是2024年的第3周
复制代码
3.
formatPast
- 将时间转换为
几秒前
、
几分钟前
、
几小时前
、
几天前
方法作用:
根据传入的时间,返回一个“相对时间”的字符串,表示间隔当前时间的时间差。比方:刚刚, 5分钟前, 2小时前, 3天前。
参数:
param:传入的时间,可以是 Date 对象或字符串。
format:可选的格式化字符串,默认是 'YYYY-mm-dd'。
返回值:
相对时间字符串(如:5分钟前)。
示例:
const date1 = new Date();
console.log(formatPast(date1)); // 输出:刚刚
const date2 = new Date('2024-01-15');
console.log(formatPast(date2)); // 输出:3天前
const date3 = new Date('2023-12-01');
console.log(formatPast(date3, 'YYYY-MM-DD')); // 输出:2023-12-01
复制代码
4.
formatAxis
- 时间问候语
方法作用:
根据传入的时间,返回适合的问候语,比方:早上好、下午好、晚上好。
参数:
param:Date 对象。
返回值:
时间问候语字符串。
示例:
const date1 = new Date('2024-01-17T08:00:00');
console.log(formatAxis(date1)); // 输出:早上好
const date2 = new Date('2024-01-17T15:00:00');
console.log(formatAxis(date2)); // 输出:下午好
const date3 = new Date('2024-01-17T20:00:00');
console.log(formatAxis(date3)); // 输出:晚上好
复制代码
5.
parseTime
- 日期格式化 (时间+日期)
方法作用:
根据传入的时间和格式,返回格式化后的日期时间字符串。支持自界说格式,可以格式化为年、月、日、小时、分钟、秒等。
参数:
time:传入的时间,支持 string、number 或 Date 对象。
pattern:格式化字符串,默认是 '{y}-{m}-{d} {h}:{i}:{s}'。可以包罗:
{y}:年份
{m}:月份
{d}:日
{h}:小时
{i}:分钟
{s}:秒
{a}:星期(中文)
返回值:
格式化后的日期时间字符串。
示例:
const date1 = new Date('2024-01-17T12:30:45');
console.log(parseTime(date1, '{y}-{m}-{d} {h}:{i}:{s}')); // 输出:2024-01-17 12:30:45
const date2 = new Date('2024-01-17T12:30:45');
console.log(parseTime(date2, '{y}-{m}-{d} 星期{a}')); // 输出:2024-01-17 星期三
复制代码
6.
parseDate
- 日期格式化 (仅年月日)
方法作用:
根据传入的时间,返回格式化后的年月日字符串。类似于 parseTime,但只处理日期部分。
参数:
time:传入的时间,支持 string、number 或 Date 对象。
pattern:格式化字符串,默认是 '{y}-{m}-{d}'。
返回值:
格式化后的日期字符串。
示例:
const date1 = new Date('2024-01-17T12:30:45');
console.log(parseDate(date1, '{y}-{m}-{d}')); // 输出:2024-01-17
const date2 = new Date('2024-01-17T12:30:45');
console.log(parseDate(date2)); // 输出:2024-01-17
复制代码
其他常量
export const dateTimeStr: string = 'YYYY-MM-DD HH:mm:ss'; // 完整的日期时间格式
export const dateStr: string = 'YYYY-MM-DD'; // 仅日期格式
export const timeStr: string = 'HH:mm:ss'; // 仅时间格式
复制代码
总结
formatDate
用于将 Date 格式化为指定格式的字符串,支持多种日期格式(如季度、星期等)。
getWeek
用于获取当前日期是该年份的第几周。
formatPast
用于将日期转换为“几秒前”、“几分钟前”等相对时间格式。
formatAxis
用于返回基于时间的问候语。
parseTime
和
parseDate
用于根据传入时间返回格式化后的日期字符串,parseTime 返回时间和日期,parseDate 仅返回日期。
欢迎光临 IT评测·应用市场-qidao123.com (https://dis.qidao123.com/)
Powered by Discuz! X3.4