如何将分钟时长格式化为XX hours and YY minute(s)格式

我来帮你搞定这个需求！不管是用原生JavaScript还是date-fns库，都能轻松实现分钟转成指定格式的时长显示，下面给你两种实用方案：

方案一：原生JavaScript实现 #

这种方案不需要依赖任何第三方库，直接通过简单的计算和字符串拼接就能完成，逻辑清晰易维护：

function formatMinutesToHours(totalMinutes) {
  // 计算小时数和剩余分钟数
  const hours = Math.floor(totalMinutes / 60);
  const minutes = totalMinutes % 60;
  
  // 处理单复数文本
  const hourLabel = hours === 1 ? 'hour' : 'hours';
  const minuteLabel = minutes === 1 ? 'minute' : 'minutes';
  
  // 根据不同情况拼接结果
  if (hours === 0) {
    return `${minutes} ${minuteLabel}`;
  }
  if (minutes === 0) {
    return `${hours} ${hourLabel}`;
  }
  return `${hours} ${hourLabel} and ${minutes} ${minuteLabel}`;
}

// 测试示例
console.log(formatMinutesToHours(1)); // 输出："1 minute"
console.log(formatMinutesToHours(100)); // 输出："1 hour and 40 minutes"
console.log(formatMinutesToHours(141)); // 输出："2 hours and 21 minutes"
console.log(formatMinutesToHours(60)); // 输出："1 hour"
console.log(formatMinutesToHours(0)); // 输出："0 minutes"（可根据需求调整该场景的显示）

这个函数的逻辑很直观：先算出总时长对应的小时数和剩余分钟，然后根据数量判断单复数形式，最后分三种情况（只有分钟、只有小时、两者都有）拼接成符合要求的字符串。

方案二：使用date-fns库实现 #

如果你已经在项目中使用了date-fns，那用它的内置方法来处理会更简洁，还能避免自己写单复数逻辑：

// 先确保已安装并导入date-fns的相关方法
import { formatDuration, intervalToDuration } from 'date-fns';

function formatMinutesToHoursWithDateFns(totalMinutes) {
  // 将分钟转换为date-fns能识别的Duration对象
  const duration = intervalToDuration({
    start: 0,
    end: totalMinutes * 60 * 1000 // 转成毫秒值
  });
  
  // 格式化时长，配置显示规则
  return formatDuration(duration, {
    format: ['hours', 'minutes'], // 指定只显示小时和分钟
    delimiter: ' and ', // 设置小时和分钟之间的连接符
    // 自定义单复数显示（date-fns默认也能处理，这里明确指定更稳妥）
    locale: {
      formatDistance: (token, count) => {
        if (token === 'hour') return count === 1 ? 'hour' : 'hours';
        if (token === 'minute') return count === 1 ? 'minute' : 'minutes';
        return '';
      }
    }
  });
}

// 测试示例
console.log(formatMinutesToHoursWithDateFns(1)); // 输出："1 minute"
console.log(formatMinutesToHoursWithDateFns(100)); // 输出："1 hour and 40 minutes"
console.log(formatMinutesToHoursWithDateFns(141)); // 输出："2 hours and 21 minutes"
console.log(formatMinutesToHoursWithDateFns(60)); // 输出："1 hour"

这里用到了intervalToDuration把分钟转换成Duration对象，再用formatDuration按照我们需要的格式输出，配置项里可以灵活调整显示的时间单位、连接符和单复数规则，非常方便。

备注：内容来源于stack exchange，提问作者eXception