如何在 JavaScript 中大写字符串首字母
Kirill Ibrahim
2024年2月15日
JavaScript
JavaScript String
-
使用
toUpperCase()和slice()方法来实现 JavaScript 中字符串首字母大写 -
使用
toUpperCase()与charAt()来实现 JavaScript 中字符串首字母大写 -
使用
toUpperCase()和replace()来实现 JavaScript 中字符串首字母大写
在 JavaScript 中,有很多方法可以将字符串的第一个字母大写。
比如说
"this is an example"->"This is an example""the Atlantic Ocean"->"The Atlantic Ocean"
使用 toUpperCase() 和 slice() 方法来实现 JavaScript 中字符串首字母大写
toUpperCase() 方法将一个字符串中的所有字母转换为大写字母;我们将结合其他 JavaScript 函数使用它来达到我们想要的目标。
slice(start,end) 方法提取一个字符串的一部分,并将其作为一个新的字符串返回。
start 是必要的参数。它是开始分片字符串的位置。
end 是可选参数。它是结束分片字符串的位置。如果省略,slice() 将在字符串的末端结束。
例子: slice() 在字符串的结尾处结束
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body style = "text-align:center;">
<input id = "input" type="text" name="input"/>
<button onclick="capitalizeString()">
Capitalize
</button>
<h3 id = "modified-string" >
</h3>
<script>
function capitalizeString() {
let input = document.getElementById("input");
let headingElement = document.getElementById("modified-string");
let string = input.value;
headingElement.innerHTML = string[0].toUpperCase() +
string.slice(1);
}
</script>
</body>
</html>
输出:

另一个例子
// shortened version
function capitalize(sentence) {
return sentence && sentence[0].toUpperCase() + sentence.slice(1);
}
使用 toUpperCase() 与 charAt() 来实现 JavaScript 中字符串首字母大写
charAt() 方法从字符串的指定索引中返回字符。索引从 0 开始。
例子:
// We will use the same html above
function capitalizeString() {
let input = document.getElementById('input');
let headingElement = document.getElementById('modified-string');
let string = input.value;
headingElement.innerHTML = string.charAt(0).toUpperCase() + string.slice(1);
;
}
使用 toUpperCase() 和 replace() 来实现 JavaScript 中字符串首字母大写
replace() 是 JavaScript 中的一个内置方法,它可以根据指定的值或正则表达式模式搜索给定的字符串,替换它,并返回一个新的字符串。
JavaScript replace() 语法
string.replace(paramA, paramB)
这里,paramA 是一个值或正则表达式,paramB 是一个用来替换 paramA 的值。
注意
原始字符串将保持不变,返回值是一个包含替换项的新字符串。
replace() 方法的简单示例
function replaceFunction() {
let str = 'Google Event';
let res = str.replace('Google', 'Microsoft');
console.log(res)
}
replaceFunction();
function replaceAllFunction() {
let str = 'Google Event will be in Headquarters of Google';
let res = str.replace(/Google/g, 'Microsoft');
console.log(res)
}
replaceFunction();
注意
replace() 方法默认只替换第一个实例。我们应该使用正则表达式全局(g)修饰符来替换所有出现的实例。例:
// We will use the same html above
function capitalizeString() {
let input = document.getElementById('input');
let headingElement = document.getElementById('modified-string');
let string = input.value;
headingElement.innerHTML = string.replace(/^./, string[0].toUpperCase());
}
/^./代表字符串的第一个字母。在 RegExp 教程 和 RegExp Object 参考 阅读更多关于正则表达式的内容。
Enjoying our tutorials? Subscribe to DelftStack on YouTube to support us in creating more high-quality video guides. Subscribe