如何实现仅字符串首字母大写而非每个单词首字母大写

需求目标：将字符串转换为仅第一个字母大写，其余所有字母为小写的格式，例如把FIRST NAME转为First name。

原有方案不符合预期的原因 #

你尝试的两种方案都是「每个单词首字母大写」的实现逻辑，和需求不匹配：

• text-transform: capitalize是CSS提供的样式属性，作用是将每个单词的首字母显示为大写，其余字符保留原有大小写，输出结果为First Name
• lodash的startCase方法会先把字符串按分隔符拆分为独立单词，再逐个做首字母大写拼接，输出结果同样为First Name

可行实现 #

原生JS实现（通用，无依赖） #

核心逻辑：先把整个字符串统一转为小写，再将第一个字符转为大写，拼接后续内容即可，可直接在浏览器、Node.js等所有JS环境使用：

function capitalizeFirst(str) {
  // 处理空值、非字符串输入的边界情况
  if (typeof str !== 'string' || !str) return '';
  const lowerStr = str.toLowerCase();
  return lowerStr.charAt(0).toUpperCase() + lowerStr.slice(1);
}

// 测试
capitalizeFirst('FIRST NAME'); // 输出: First name

适配开头含非字母场景的版本 #

如果字符串可能以空格、数字、特殊符号开头，可以用正则匹配第一个出现的字母做大写转换：

function capitalizeFirst(str) {
  if (typeof str !== 'string' || !str) return '';
  return str.toLowerCase().replace(/[a-z]/, char => char.toUpperCase());
}

// 测试
capitalizeFirst('  123HELLO WORLD'); // 输出: "  123Hello world"

注意事项 #

不要依赖CSS样式完成需要业务逻辑使用的文本转换：text-transform仅修改页面上的视觉展示效果，不会改变DOM节点存储的原始文本值，如果后续需要提交表单、做文本匹配校验，必须通过JS方法完成实际的字符串转换。

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