如何使用 JavaScript 将字符串中每个单词的首字母大写？

Posted 2023-02-22

【中文标题】如何使用 JavaScript 将字符串中每个单词的首字母大写？

【英文标题】：How can I capitalize the first letter of each word in a string using JavaScript?

【发布时间】：2015-12-11 21:28:33

【问题描述】：

我正在尝试编写一个函数，将字符串中每个单词的首字母大写（将字符串转换为标题大小写）。

例如，当输入是"I'm a little tea pot"，我希望"I'm A Little Tea Pot" 是输出。但是，该函数返回"i'm a little tea pot"。

这是我的代码：

function titleCase(str) 
  var splitStr = str.toLowerCase().split(" ");

  for (var i = 0; i < splitStr.length; i++) 
    if (splitStr.length[i] < splitStr.length) 
      splitStr[i].charAt(0).toUpperCase();
    

    str = splitStr.join(" ");
  

  return str;


console.log(titleCase("I'm a little tea pot"));

【问题讨论】：

这看起来不像只是将字符串的第一个字母大写。或者你的意思是你想把字符串中包含的每个单词都大写。

您没有将您的大写字母分配给您的结果，splitStr[i].charAt(0).toUpperCase(); 将转到void。你需要做splitStr[i] = splitStr[i].charAt(0).toUpperCase() + splitStr[i].substring(1);

你应该先告诉我们。该功能有什么问题？预期的结果是什么？它返回的是什么？

这个函数看起来像是试图将每个单词的第一个字符大写。

正如标题所说，我试图将字符串中每个单词的第一个字母大写。我不欣赏在本质上应该是支持性的论坛上的反对意见或消极情绪。 @somethinghere - 感谢您的回复。

【参考方案1】：

function titleCase(str) 
  //First of all, lets make all the characters lower case
  let lowerCaseString = "";
  for (let i = 0; i < str.length; i++) 
    lowerCaseString = lowerCaseString + str[i].toLowerCase();
  
  //Now lets make the first character in the string and the character after the empty character upper case and leave therest as it is
  let i = 0;
  let upperCaseString = "";
  while (i < lowerCaseString.length) 
    if (i == 0) 
      upperCaseString = upperCaseString + lowerCaseString[i].toUpperCase();
     else if (lowerCaseString[i - 1] == " ") 
      upperCaseString = upperCaseString + lowerCaseString[i].toUpperCase();
     else 
      upperCaseString = upperCaseString + lowerCaseString[i];
    
    i = i + 1;
  
  console.log(upperCaseString);

  return upperCaseString;


titleCase("hello woRLD");

【参考方案2】：

这里我使用了toLowerCase()、toUpperCase()和replace(regex,replacer)三个函数

function titleCase(str)  
     return str.toLowerCase().replace(/^(\w)|\s(\w)/g, (grp) => grp.toUpperCase()); 

titleCase("I'm a little tea pot");

【参考方案3】：

这里我使用了replace()函数。

function titleCase(str)
    return str.replace(/\w\S*/g, function(txt)return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(););

【参考方案4】：

/* 1. Transform your string into lower case
   2. Split your string into an array. Notice the white space I'm using for the separator
   3. Iterate the new array, and assign the current iteration value (array[c]) a new formatted string:
      - With the sentence: array[c][0].toUpperCase() the first letter of the string converts to upper case.
      - With the sentence: array[c].substring(1) we get the rest of the string (from the second letter index to the last one).
      - The "add" (+) character is for concatenate both strings.
   4. return array.join(' ') // Returns the formatted array like a new string. */


function titleCase(str)
    str = str.toLowerCase();
    var array = str.split(' ');
    for(var c = 0; c < array.length; c++)
        array[c] = array[c][0].toUpperCase() + array[c].substring(1);
    
    return array.join(' ');


titleCase("I'm a little tea pot");

【参考方案5】：

这是一种简单的转换方法，并且能够传递一个值来获得所需的输出。

String.prototype.toChangeCase = function (type) 
    switch (type) 
        case 'upper-first':
            return this.charAt(0).toUpperCase() + this.substr(1).toLowerCase();
        case 'upper-each':
            return this.split(' ').map(word => 
                return word.charAt(0).toUpperCase() + word.substr(1).toLowerCase();
            ).join(' ');
        default:
            throw Error(`In order to get the output pass a value 'upper-first', 'upper-each'`);
    

输出

"capitalize first Letter of Each word in a Sstring".toChangeCase('upper-first')
"Capitalize first letter of each word in a sstring"


"capitalize first Letter of Each word in a Sstring".toChangeCase('upper-each')
"Capitalize First Letter Of Each Word In A Sstring"

"Capitalize First Letter Of Each Word In A String".toChangeCase()
VM380:12 Uncaught Error: In order to get the output pass a value 'upper-first', 'upper-each'
    at String.toChangeCase (<anonymous>:12:19)
    at <anonymous>:16:52

【参考方案6】：

let string = "I'm a little tea pot";

现在，创建一个将字符串作为参数的函数。

function titleCase(str) 
   return str.split(" ").map(s => s.charAt(0).toUpperCase() + s.substr(1).toLowerCase()).join(" ")
 

输出

titleCase(string); // "I'm A Little Tea Pot"

【讨论】：

请不要只发布代码作为答案，还要解释您的代码的作用以及它如何解决问题的问题。带有解释的答案通常更有帮助，质量更高，更有可能吸引投票。

感谢@MarkRotteveel！我试图提供一个解释。

【参考方案7】：

你可以用这样简单的方法在一行中使用带有 toUpperCase 的地图：

    text.split(' ').map(w =>  let t = w.split(''); t[0] = t[0].toUpperCase(); return t.join('') ).join(' ')

【讨论】：

是的，这是我的错，我修正了我的答案，只是以这种方式进行了更改： text.split(' ').map(w => let t = w.split('') ; t[0] = t[0].toUpperCase(); return t.join('') ).join(' ')

【参考方案8】：

我已经使用下面的代码完成了这项工作，希望对您有所帮助：

<p id="p1">This is a paragraph.</p>

<script>
   const capitalize = (mySentence) => 
      const words = mySentence.split(" ");
      for (let i = 0; i < words.length; i++) 
         words[i] = words[i][0].toUpperCase() + words[i].substr(1);
      
      return words.join(" ");
   ;  
   const result = capitalize('This is a sample text');
   document.getElementById("p1").innerhtml = result;
</script>