在 JavaScript 中将每个单词的第一个字母大写
将字符串中每个单词的首字母大写：
-
使用
split()方法将字符串拆分为单词数组。 -
使用
Array.map()方法迭代数组。 -
使用
join()方法将数组连接成一个字符串。
function toTitleCase(str) {
const titleCase = str
.toLowerCase()
.split(' ')
.map(word => {
return word.charAt(0).toUpperCase() + word.slice(1);
})
.join(' ');
return titleCase;
}
// 👇️ Bobby Hadz
console.log(toTitleCase('bobby hadz'));
// 👇️ Hello World
console.log(toTitleCase('hello world'));
// 👇️ ''
console.log(toTitleCase(''));
我们创建了一个可重用函数，将字符串中每个单词的首字母大写。
我们首先将整个字符串转换为小写，以确保每个单词中只有第一个字母是大写的。
如果我们不想将单词中的所有非首字母小写，请删除对
toLowerCase()方法的调用。
我们使用 String.split() 方法将字符串拆分为单词数组。
// 👇️ ['Hello', 'world']
console.log('Hello world'.split(' '));
我们传递给 Array.map 方法的函数会针对数组中的每个元素进行调用。
map() 方法返回一个新数组，其中包含从回调函数返回的值。
在函数中，我们访问每个单词的第一个字符，将其转换为大写并将其连接到字符串的其余部分。
// 👇️ ['Hello', 'World']
console.log(
'hello world'.split(' ').map(word => {
return word.charAt(0).toUpperCase() + word.slice(1);
}),
);
此时，我们有一个数组，其中包含字符串中的单词，每个单词的首字母大写。
最后一步是使用 Array.join() 方法将数组连接成一个字符串。
// 👇️ "Hello World"
console.log(
'hello world'
.split(' ')
.map(word => {
return word.charAt(0).toUpperCase() + word.slice(1);
})
.join(' '),
);
我们还可以使用 CSS 将每个单词的首字母大写。
使用 CSS 将每个单词的首字母大写
将每个单词的第一个字母大写：
- 选择元素。
- 将元素的文本转换样式设置为大写。
这是示例的 HTML。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body>
<p id="paragraph">fql jiyik com</p>
<script type="module" src="index.js"></script>
</body>
</html>
这是相关的 JavaScript 代码。
const paragraph = document.getElementById('paragraph');
paragraph.style.textTransform = 'capitalize';
p 标签在运行 JavaScript 代码后变成 Fql Jiyik Com。
当 text-transform 属性设置为 capitalize 时，每个单词的第一个字母都会大写。
字符串中的其他字符保持不变。
使用 String.replace() 将每个单词的首字母大写
将每个单词的第一个字母大写：
-
将
String.replace()方法与正则表达式结合使用。 - 正则表达式应匹配每个单词的第一个字母。
-
使用
toUpperCase()方法将匹配项转换为大写。
function toTitleCase(str) {
return str.replace(/(^\w|\s\w)/g, m => m.toUpperCase());
}
// 👇️ Hello World
console.log(toTitleCase('hello world'));
// 👇️ Fql Jiyik Com
console.log(toTitleCase('fql jiyik com'));
String.replace() 方法返回一个新字符串，其中一个、一些或所有正则表达式的匹配项被替换为提供的替换项。
该方法采用以下参数：
- pattern 要在字符串中查找的模式。 可以是字符串或正则表达式。
- replacement 一个字符串，用于将匹配的子字符串替换为提供的模式。
String.replace() 方法返回一个新字符串，其中替换了模式的匹配项。 该方法不会更改原始字符串。
字符串在 JavaScript 中是不可变的。
正斜杠 // 标记正则表达式的开始和结束。
function toTitleCase(str) {
return str.replace(/(^\w|\s\w)/g, m => m.toUpperCase());
}
^\w 匹配字符串中的第一个字母。
管道 | 特殊字符表示 OR，例如 X|Y 匹配 X 或 Y。
\s\w 部分匹配空白字符后的第一个字母。
我们设置 g 标志是因为我们想要匹配单词中第一个字母的所有出现，而不仅仅是第一次出现。
总的来说，正则表达式匹配字符串的第一个字母和每个单词的第一个字母。
我们传递给 replace() 方法的第二个参数是一个在每次匹配时调用的函数。
我们使用 String.toUpperCase() 方法将每个匹配项（每个单词的第一个字母）转换为大写。
相关文章
使用 CSS 和 JavaScript 制作文本闪烁
发布时间：2023/04/28 浏览次数：146 分类：CSS
-
本文提供了使用 CSS、JavaScript 和 jQuery 使文本闪烁的详细说明。
在 PHP 变量中存储 Div Id 并将其传递给 JavaScript
发布时间：2023/03/29 浏览次数：69 分类：PHP
-
本文教导将 div id 存储在 PHP 变量中并将其传递给 JavaScript 代码。
在 JavaScript 中从字符串中获取第一个字符
发布时间：2023/03/24 浏览次数：93 分类：JavaScript
-
在本文中，我们将看到如何使用 JavaScript 中的内置方法获取字符串的第一个字符。
在 JavaScript 中获取字符串的最后一个字符
发布时间：2023/03/24 浏览次数：141 分类：JavaScript
-
本教程展示了在 javascript 中获取字符串最后一个字符的方法
