本文详解如何安全地将空格分隔的姓名字符串中每个单词的首字母大写，重点解决因末尾空格导致 split(' ') 产生空字符串、进而引发 n[0] 为 undefined 的运行时错误问题。
本文详解如何安全地将空格分隔的姓名字符串中每个单词的首字母大写，重点解决因末尾空格导致 `split(' ')` 产生空字符串、进而引发 `n[0]` 为 `undefined` 的运行时错误问题。
在 JavaScript 中，对多单词姓名（如 'jessica ann smith davis '）执行“每个单词首字母大写”操作时，常见做法是使用 split(' ') 拆分、遍历并大写首字符。但该方法存在一个易被忽视的陷阱：输入字符串末尾或中间存在多余空格时，split(' ') 会生成空字符串元素（''）。此时访问 n[0] 将返回 undefined，调用 toUpperCase() 会抛出 TypeError: Cannot read property 'toUpperCase' of undefined。
例如原始代码：
const capitalizeName = function (name) {
const names = name.split(` `);
const uppercasedName = [];
for (const n of names) {
uppercasedName.push(n.replace(n[0], n[0].toUpperCase())); // ❌ 当 n === '' 时，n[0] 是 undefined
}
console.log(uppercasedName.join('')); // 错误：未处理空字符串；且 join('') 会丢失空格
};
capitalizeName('jessica ann smith davis '); // 输入含尾随空格 → names 包含 ['', 'davis', ''] 等
✅ 正确做法需同时满足三点：
- 过滤空字符串：在循环中跳过 n 为假值（如 ''、null、undefined）的情况；
- 保留单词间空格：join(' ') 而非 join('')；
- 返回结果而非仅打印：函数应返回处理后的字符串，便于复用。
优化后的健壮实现如下：
const capitalizeName = function (name) {
const names = name.split(' ');
const upperName = [];
for (const n of names) {
if (n) { // ✅ 安全检查：仅处理非空字符串
upperName.push(n.charAt(0).toUpperCase() + n.slice(1));
}
}
return upperName.join(' '); // ✅ 用空格连接，还原单词间隔
};
// 测试用例
console.log(capitalizeName('jessica ann smith davis ')); // "Jessica Ann Smith Davis"
console.log(capitalizeName(' john doe ')); // "John Doe"
console.log(capitalizeName('alice')); // "Alice"
⚠️ 注意事项：
- 使用 n.charAt(0) 比 n[0] 更安全（对空字符串返回 '' 而非 undefined），但配合 if (n) 判断已足够；
- 若需支持更复杂的空白字符（如制表符、换行符），建议改用正则 split(/\s+/) 并配合 trim() 预处理；
- 生产环境推荐使用更健壮的方案，例如：
const capitalizeName = name => name.trim().split(/\s+/).map(word => word && word[0].toUpperCase() + word.slice(1)).join(' ');
总结：字符串分割后务必校验数组元素有效性，避免隐式类型转换引发的运行时错误；良好的输入容错能力是编写可靠工具函数的关键。
