如何使用 JavaScript 将字符串数组中每个元素的首字母大写并返回新数组-js教程-PHP中文网

如何使用 JavaScript 将字符串数组中每个元素的首字母大写并返回新数组

本文介绍如何利用 map() 配合字符串方法，将字符串数组中每个元素的首字母转为大写、其余字符保持不变，并返回处理后的新数组。代码简洁高效，适合初学者理解与实践。

本文介绍如何利用 `map()` 配合字符串方法，将字符串数组中每个元素的首字母转为大写、其余字符保持不变，并返回处理后的新数组。代码简洁高效，适合初学者理解与实践。

在 JavaScript 中，将字符串数组中每个元素的首字母大写是一个常见需求，例如格式化人名、标签或用户输入。核心思路是：对数组进行遍历（推荐使用 map()），对每个字符串分别提取首字符并转为大写，再拼接剩余部分。

以下是标准实现方式：

const names = ['john', 'alice', 'bob', 'mary'];
const capitalized = names.map((str) => 
  str.charAt(0).toUpperCase() + str.slice(1)
);
console.log(capitalized); // ['John', 'Alice', 'Bob', 'Mary']

✅ 关键点说明：

js2java

JavaScript 到 Java 全栈翻译助手，专为前端开发者学习 Java 或快速实现后端业务逻辑而设计。当用户提到以下场景时必须使用此技能： - "帮我把这段 JS 代码转成 Java" - "用 Java 怎么写这个逻辑" - "我习惯用 JS 写，想翻译成 Java" - "教我 Java，我要写后端接...

下载

str.charAt(0) 安全获取首字符（空字符串时返回空字符串，不会报错）；
toUpperCase() 将首字符转为大写；
str.slice(1) 截取从索引 1 开始到末尾的子串（若字符串长度 ≤ 1，则返回空字符串，天然兼容单字符或空字符串）；
map() 返回全新数组，不修改原数组，符合函数式编程原则。

⚠️ 注意事项：

避免使用已废弃的 substr()（如答案中所示），推荐用 slice(1) 替代，语义更清晰且行为更可靠；

若需处理 null 或 undefined 元素，建议先做类型校验：

const capitalized = names.map(str => 
  typeof str === 'string' && str.length > 0 
    ? str.charAt(0).toUpperCase() + str.slice(1) 
    : str
);

对于 Unicode 多字节字符（如带重音符号的字母或 emoji），charAt(0) 和 slice(1) 在大多数常见场景下仍可工作；如需严格支持国际化（如 café → Café），应使用 str.normalize().at(0) 和 str.normalize().slice(1) 或正则方案，但对初学者而言，上述基础方案已足够健壮。