JS 如何使字符串的第一个字母变成大写？

在JavaScript中，将字符串的第一个字母变为大写通常有多种方式，以下是两种常见的方法：

方法1：使用字符串的 charAt() 和 slice() 方法

javascript
function capitalizeFirstLetter(string) {
    // 如果字符串为空，则直接返回
    if(!string) return string;

    // 使用 charAt(0) 获取第一个字符，并将其转换为大写
    // 然后使用 slice(1) 获取第一个字符之后的所有字符
    // 最后将两部分组合起来
    return string.charAt(0).toUpperCase() + string.slice(1);
}

// 示例
const exampleString = "hello";
console.log(capitalizeFirstLetter(exampleString)); // 输出: "Hello"

方法2：使用正则表达式和 replace() 方法

javascript
function capitalizeFirstLetter(string) {
    // 如果字符串为空，则直接返回
    if(!string) return string;

    // 使用正则表达式匹配字符串的第一个字母，并使用 replace() 替换它
    // 函数replace的第二个参数是一个函数，它的返回值将替换掉匹配到的内容
    return string.replace(/^\w/, c => c.toUpperCase());
}

// 示例
const exampleString = "hello";
console.log(capitalizeFirstLetter(exampleString)); // 输出: "Hello"

这两个函数都可以达到我们想要的效果，即将输入字符串的第一个字母转换为大写。您可以根据实际需求和代码风格选择适合的方法。

function capitalizeFirstLetter(string) { return string.charAt(0).toUpperCase() + string.slice(1); }

其他一些答案会修改String.prototype（这个答案也曾经如此），但由于可维护性，我现在建议不要这样做（很难找出该函数被添加到的位置，prototype并且如果其他代码使用相同的名称/浏览器，可能会导致冲突）将来添加具有相同名称的本机函数）。

一种面向对象的方法：

shell
Object.defineProperty(String.prototype, 'capitalize', {
  value: function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
  },
  enumerable: false
});

调用函数的方式如下：

shell
"hello, world!".capitalize();

预期输出为：

shell
"Hello, world!"

CSS 处理方式如下：

shell
 p::first-letter {
    text-transform:capitalize;
}

Here is a shortened version of the popular answer that gets the first letter by treating the string as an array:

shell
function capitalize(s)
{
    return s[0].toUpperCase() + s.slice(1);
}

Update

According to the comments below this doesn't work in IE 7 or below.

Update 2:

To avoid undefined for empty strings (see @njzk2's comment below), you can check for an empty string:

shell
function capitalize(s)
{
    return s && s[0].toUpperCase() + s.slice(1);
}

ES6 version

shell
const capitalize = s => s && s[0].toUpperCase() + s.slice(1)

// to always return type string event when s may be falsy other than empty-string
const capitalize = s => (s && s[0].toUpperCase() + s.slice(1)) || ""

If you're interested in the performance of a few different methods posted:

Here are the fastest methods based on this jsperf test (ordered from fastest to slowest).

As you can see, the first two methods are essentially comparable in terms of performance, whereas altering the String.prototype is by far the slowest in terms of performance.

shell
// 10,889,187 operations/sec
function capitalizeFirstLetter(string) {
    return string[0].toUpperCase() + string.slice(1);
}

// 10,875,535 operations/sec
function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

// 4,632,536 operations/sec
function capitalizeFirstLetter(string) {
    return string.replace(/^./, string[0].toUpperCase());
}

// 1,977,828 operations/sec
String.prototype.capitalizeFirstLetter = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

Edited to add this DISCLAIMER: please read the comments to understand the risks of editing JS basic types.

---

Here's a more object-oriented approach:

shell
Object.defineProperty(String.prototype, 'capitalize', {
  value: function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
  },
  enumerable: false
});

You'd call the function, like this:

shell
"hello, world!".capitalize();

With the expected output being:

shell
"Hello, world!"

In CSS:

shell
p::first-letter {
    text-transform:capitalize;
}

在 JavaScript 中，您可以使用以下方法将字符串的第一个字母变为大写：

javascript
function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

const myString = "hello world";
const capitalized = capitalizeFirstLetter(myString);

console.log(capitalized); // 输出: Hello world

这个 capitalizeFirstLetter 函数通过以下步骤工作：

1. string.charAt(0).toUpperCase() 获取字符串的第一个字符并将其转换为大写字母。
2. string.slice(1) 获取除了第一个字符之外的所有字符，即从索引 1 开始到字符串的末尾。
3. 然后使用 + 操作符将得到的大写字母和剩余部分拼接在一起，形成新的字符串。