[Day 06] JavaScript 將字串首字母轉換為大寫 - 嘗試 30 日寫文充版挑戰

前言 - Prologue

嘗試 30 天寫文充實版面 ~~(成功跳過假日 ლ(́◕◞౪◟◕‵ლ) )~~ 不間斷更新文章的 Day 6

在許多資訊系統中，字串是一種非常常用的數據類型。有時需要將字串的首字母轉換為大寫，以符合某些命名規則或單一風格。

在接下來這篇文章中，我們將介紹如何使用 JavaScript 來實現首字母轉為大寫的操作，並探討一些常見的字串處理技巧。接下來，我們將深入探索字串，了解如何實現這項操作，並進行一些範例。

語法 - Syntax

toUpperCase()
substr()
slice()
charAt()
replace()
Regular expression

可以使用上列幾種組合搭配後就可以實現首字母轉為大寫啦，當然也有其他方法！

但這篇文章主要介紹的是下方範例的幾種。

範例 - Example

本文將會舉出四種方法：

方法1：使用 `toUpperCase()` 和 `substr()` 方法

# ES5
function capitalizeFirstLetter(str) {
  return str.substr(0, 1).toUpperCase() + str.substr(1);
}

// Expected output: Hello world
console.log(capitalizeFirstLetter("hello world"));

運用 substr(0, 1) 取從索引值 0 的首字符 (e.g. hello world -> h) 並使用 toUpperCase() 轉大寫，再使用 substr(1) 取得除了首字符以外的字符，並與前面連接起來。

方法2：使用 `toUpperCase()` 、 `charAt()` 和 `slice()` 方法

# ES5
function capitalizeFirstLetter(str) {
  return str.charAt(0).toUpperCase() + str.slice(1);
}

// Expected output: Hello world
console.log(capitalizeFirstLetter("hello world"));

運用 charAt(0) 指定首字符並使用 toUpperCase() 轉大寫，再同 slice(1) 切掉首字符後連接起來。

方法3：使用 `toUpperCase()` 、 `replace()` 和 `Regular expression` 方法

# ES5
function capitalizeFirstLetter(str) {
  return str.replace(/^./, str[0].toUpperCase());
}

// Expected output: Hello world
console.log(capitalizeFirstLetter("hello world")); 
// Expected output: 123 Hello world
console.log(capitalizeFirstLetter("123 hello world")); 
// Expected output: #Hello world
console.log(capitalizeFirstLetter("#hello world"));

正則表達式 /^./ 將匹配字符串的首字符，無論是字母還是符號，是字母的話就會將其取代為大寫。

使用 /^\w/ 也是可以，正則表達式 /^\w/ 和 /^./ 的差別在於，前者只會匹配字母和數字字符（即 \w），而後者則會匹配任意字符（包括字母、數字、符號等）。

如果只希望匹配字母或數字，那麼可以使用 /^\w/。

# ES5
function capitalizeFirstLetter(str) {
  return str.replace(/^\w/, str[0].toUpperCase());
}

// Expected output: Hello world
console.log(capitalizeFirstLetter("hello world")); 
// Expected output: 123 Hello world
console.log(capitalizeFirstLetter("123 hello world")); 
// Expected output: #hello world 
console.log(capitalizeFirstLetter("#hello world")); 

# Only 字母或數字

方法4：使用 `toUpperCase()` 和 `slice()` 方法

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

// Expected output: Hello world
console.log(capitalizeFirstLetter("hello world"));