如何在 JavaScript 中大寫字串首字母

Kirill Ibrahim 2023年10月12日
  1. 使用 toUpperCase()slice() 方法來實現 JavaScript 中字串首字母大寫
  2. 使用 toUpperCase()charAt() 來實現 JavaScript 中字串首字母大寫
  3. 使用 toUpperCase()replace() 來實現 JavaScript 中字串首字母大寫
如何在 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>

輸出:

JavaScript 大寫字串的首字母

另一個例子

// 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 參考 閱讀更多關於正規表示式的內容。

相關文章 - JavaScript String