本文将介绍如何将字符串转换为小写和大写字符。

我们还将介绍如何仅将单词中的第一个字母大写,以及如何将句子中每个单词的首字母大写。

让我们开始吧!

如何在 JavaScript 中使用 toLowerCase() 方法

toLowerCase 方法将字符串转换为小写字母。

该方法的一般语法如下所示:

String.toLowerCase()

toLowerCase() 方法不接受任何参数。

JavaScript 中的字符串是不可变的toLowerCase() 方法将指定的字符串转换为仅由小写字母组成的新字符串,并返回该值。

这意味着旧的原始字符串不会以任何方式被更改或受影响。

let myGreeting = 'Hey there!';

console.log(myGreeting.toLowerCase());

//output
//hey there!

字符串 myGreeting 仅包含一个转换为小写的大写字母。

任何已经是小写的字母都不受 toLowerCase() 方法的影响,只有大写字母会被改成小写字母。这些字母保留其原始形式。

下面示例中的字符串全部由大写字母组成。当应用 toLowerCase() 方法时,它们都被转换为小写。

const  anotherGreeting = 'GOOD MORNING!!';

console.log(anotherGreeting.toLowerCase());
//output
//good morning!!

如何在 JavaScript 中使用 toUpperCase() 方法

toUpperCase() 方法类似于 toLowerCase() 方法,但它将字符串值转换为大写。

调用该方法的一般语法如下所示:

String.toUpper()

它不接受任何参数。

由于 JavaScript 中的字符串是不可变的,因此 toLowerCase() 方法不会更改指定字符串的值。

相反,它返回一个新值。指定的字符串被转换为一个新的字符串,其内容仅由所有大写字母组成。这意味着现在将有两个字符串:原始字符串和新转换的大写字符串。

console.log('I am shouting!'.toUpperCase());

//output
//I AM SHOUTING!

字符串中已有的任何大写字母都不会受到影响,并且在调用 toLowerCase() 方法时将保持不变。

如何在 JavaScript 中只将字符串中的第一个字母大写

如果你只想将字符串的第一个字母设置为大写怎么办?

下面是一个简单的示例,向你展示了一种方法。

假设有一个名为 myGreeting 的变量,字符串值为 hello,全部为小写字母。

let myGreeting = 'hello';

你首先使用其索引定位并提取该字符串的第一个字母,然后在该特定字母上调用 toUpperCase() 方法。

提醒一下,JavaScript(和大多数编程语言)中的索引从 0 开始,因此第一个字母的索引为 0

将此操作保存在名为 capFirstLetter 的新变量中。

let capFirstLetter = myGreeting[0].toUpperCase();

console.log(capFirstLetter);
// returns the letter 'H' in this case

接下来,你要隔离并切断第一个字符,并保留字符串的其余部分。

一种方法是使用 slice() 方法。这将创建一个从指定索引开始到单词结尾的新字符串。

你想从第二个字母开始直到值的结尾。

在这种情况下,你应该传递给 slice() 的参数是索引 1,因为这是第二个字母的索引。

这样,第一个字符就被完全排除了。返回一个没有它但包含其余字符的新字符串——减去第一个字母。

然后将该操作保存到一个新变量中。

let restOfGreeting = myGreeting.slice(1);

console.log(restOfGreeting);
//returns the string 'ello'

通过将两个新变量与串联组合,你将获得一个新字符串,其中仅第一个字母大写。

let newGreeting = capFirstLetter + restOfGreeting;

console.log(newGreeting);
//Hello

另一种方法是将上面的步骤组合起来,并将它们隔离在一个函数中。

该函数只创建一次。然后该函数返回一个首字母大写的新字符串。

你需要编写的代码量大大减少,同时还可以将任何字符串作为参数传递,而无需编写重复代码。

function capFirst(str) {
     return str[0].toUpperCase() + str.slice(1);
 }

console.log(capFirst('hello'));
//output 
//Hello

如何将 JavaScript 中每个单词的第一个字母大写

但是,如何使句子中每个单词的第一个字母大写呢?

上面部分中显示的方法不起作用,因为它不处理多个单词,只处理句子中的单个单词。

假设你有一个像下面这样的句子,你希望将句子中的每个第一个单词大写。

let learnCoding = 'learn to code for free with freeCodeCamp';

第一步是将句子拆分为单独的单词,并分别处理每个单词。

为此,你使用 split() 方法,并传递一个空格作为参数。这意味着在提供的句子中的每个空格中,一个项目被传递到一个新数组中。

它根据空格分割句子。

创建一个新变量并存储新数组。

let splitLearnCoding = learnCoding.split(" ");

console.log(splitLearnCoding); 
//['learn', 'to', 'code', 'for', 'free', 'with', 'freeCodeCamp']

现在,从这句话中,有一个新的单词数组,允许你单独操作每个单词。

由于现在有一个新数组,你可以使用 map() 方法迭代其中的每个单独项目。

map() 方法中,你使用上一节中显示的相同过程分别获取每个单词,将第一个字母大写,然后返回单词的其余部分。

let capSplitLearnCoding = splitLearnCoding.map(word => {
    return word[0].toUpperCase() + word.slice(1);
})

console.log(capSplitLearnCoding);
//['Learn', 'To', 'Code', 'For', 'Free', 'With', 'FreeCodeCamp']

现在每个单词的第一个字母都大写。

现在剩下的就是再次将数组中的单词组合成一个句子。

为此,你使用 join() 方法并传递一个空格作为参数。

let learnCodingNew = capSplitLearnCoding.join(" ");

console.log(learnCodingNew);
//Learn To Code For Free With FreeCodeCamp

如上一节所示,你还可以创建一个结合所有这些步骤的函数。然后,你将能够将任何字符串作为参数传递,并且其中每个单词的第一个字母都将是大写的。

function capFirstLetterInSentence(sentence) {
    let words = sentence.split(" ").map(word => {
        return word[0].toUpperCase() + word.slice(1);
    })
    return words.join(" ");
}

console.log(capFirstLetterInSentence("i am learning how to code"));
//I Am Learning How To Code

总结

这就是你在 JavaScript 中使用 toLowerCase()toUpperCase() 方法的方式。

你学习了如何将单词的首字母大写,以及如何将句子中每个单词的首字母大写。

如果你想学习 JavaScript 并更好地理解这门语言,freeCodeCamp 有免费的 JavaScript 认证课程

作为初学者,你将从基础知识开始,然后进入更复杂的主题,如面向对象编程、函数式编程、数据结构、算法和调试技术。最后,你将构建五个项目来实践你的技能。

感谢阅读,祝你学习愉快!

原文:JavaScript toLowerCase() – How to Convert a String to Lowercase and Uppercase in JS,作者:Dionysia Lemonaki