React中Date.toUTCString()显示GMT而非Z/UTC，如何控制该行为？

我太懂这种反复写自定义格式化工具的烦躁了！JavaScript里toUTCString()的这个行为确实是个历史遗留坑——早期规范把GMT和UTC混为一谈，哪怕方法名是toUTCString，输出还是带GMT后缀，对于需要严格区分或者用祖鲁时间标识的行业来说，确实闹心。下面给你几个不用依赖moment的简洁方案：

方案1：用原生Intl.DateTimeFormat自定义格式（推荐） #

这是现代浏览器和Node.js都支持的原生API，完全不用引入第三方库，还能灵活控制输出格式：

const formatUtcWithZ = (date) => {
  // 格式化出不带时区的UTC日期时间部分
  const datePart = new Intl.DateTimeFormat('en-US', {
    year: 'numeric',
    month: 'short',
    day: '2-digit',
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit',
    timeZone: 'UTC'
  }).format(date);
  // 拼接祖鲁时间标识Z
  return `${datePart} Z`;
};

// 示例使用
const now = new Date();
console.log(formatUtcWithZ(now)); 
// 输出类似：Oct 12, 2024, 14:35:22 Z

如果想要更贴近toUTCString()的紧凑格式（比如Wed, 12 Oct 2024 14:35:22 Z），可以调整参数：

const formatUtcRfcLikeWithZ = (date) => {
  return new Intl.DateTimeFormat('en-US', {
    weekday: 'short',
    day: '2-digit',
    month: 'short',
    year: 'numeric',
    hour: '2-digit',
    minute: '2-digit',
    second: '2-digit',
    timeZone: 'UTC',
    hour12: false
  }).format(date).replace(',', '') + ' Z';
};

方案2：轻量替代库（比moment轻量化很多） #

如果原生API的灵活性还是不够，不想自己拼接格式，可以用更轻量的日期库，避免moment的冗余体积：

• date-fns：模块化设计，按需引入

  import { format } from 'date-fns';
  import { utcToZonedTime } from 'date-fns-tz';
  
  const formattedDate = format(utcToZonedTime(new Date(), 'UTC'), 'EEE, dd MMM yyyy HH:mm:ss xx');
  // 输出带Z后缀：Wed, 12 Oct 2024 14:35:22 Z
  

• luxon：基于原生Intl API，语法更直观

  import { DateTime } from 'luxon';
  
  const formattedDate = DateTime.utc().toFormat('EEE, dd MMM yyyy HH:mm:ss Z');
  // 输出同样带Z后缀
  

方案3：快速字符串替换（应急场景） #

如果只是临时需求，想快速把toUTCString()的GMT换成Z，也可以用字符串替换的hack方式：

const date = new Date();
const utcWithZ = date.toUTCString().replace('GMT', 'Z');
// 输出：Wed, 12 Oct 2024 14:35:22 Z

注意：这个方法依赖toUTCString()的输出格式，不同浏览器/环境可能有细微差异，不推荐在生产环境大规模使用，但简单场景下够用。

最后补充一句：JavaScript的Date API确实有不少历史遗留的设计问题，不过现代的Intl.DateTimeFormat已经能覆盖大部分格式化需求，完全可以替代moment这类重型库啦！

内容的提问来源于stack exchange，提问作者scot