JavaScript 字串方法整理

以下針對不同類型的字串方法做分類整理：

分類	語法
回傳單一字元	charAt()、charCodeAt()
回傳新字串	concat()、repeat()、slice()、substr()、substring()、trim()、toLowerCase()、toUpperCase()
檢查字串	endsWith()、startsWith()、includes()、indexOf()
檢查字串 - 可與正規表達式搭配	search()、match()、replace()、relaceAll()
字串與陣列	split()、join()

回傳單一字元

charAt()：回傳指定位置的字元

在參數中放入 0 到 字串長度-1 的數字，

let str = "HELLO WORLD";
let char = str.charAt(2) //L

charCodeAt()：回傳指定位置字元的 Unicode 編碼

在參數中放入 0 到 字串長度-1 的數字。

let str = "HELLO WORLD";
let char = str.charCodeAt(0);//72

回傳新字串

concat()：連接多個字串

參數中放入欲連接的字串。

let str1 = "Hello ";
let str2 = "world!";
let n = str1.concat(str2); //"Hello world!"

// 可以放入多個字串
let str1 = "Hello ";
let str2 = "world!";
let str3 = "mavis!";
let n = str1.concat(str2,str3); //"Hello world!mavis!"

repeat()：複製字串數次

參數中放入要複製的次數

let str = "Hello!";
let n = str.repeat(3);//"Hello!Hello!Hello!"

slice()：提取字串片段

參數中可放入兩個值：slice(起始位置,結束位置)

1. 起始位置，可為負值
2. （選填）結束位置，可為負值，預設會傳到字串結尾

let str = "Hello world!";
let n = str.slice(0,5); //"Hello"

let str = "Hello world!";
let n = str.slice(-2,4); //""，

substr()：提取字串片段

參數中可放入兩個值：substr(起始位置,提取字串長度)

1. 起始位置，可為負值
2. （選填）提取字串長度，預設回傳到字串結尾

let str="Hello world!";
let n = str.substr(6,5)//world

substring()：提取字串片段

參數中可放入兩個值：substring(起始位置,結束位置)

1. 起始位置，不可為負值
2. （選填）結束位置，不可為負值，預設會傳到字串結尾

let str = "Hello world!";
let n = str.substring(0,5); //"Hello"

let str="Hello world!";
let n = str.substring(-2,5); //"Hello"，若帶入負值會從預設 0 開始

trim()：去除字串兩邊空白

空白包含 enter、tab、換行符號，並不適用於 null, undefined。

let str="  mavis  ";
let n = str.trim();// "Mavis"

toLowerCase()：字串轉換成小寫

將字串轉換成小寫

let str="MAVIS";
let n = str.toLowerCase();// "mavis"

toUpperCase()：字符串轉換成大寫

字串轉換成大寫

let str="mavis";
let n = str.toUpperCase();// "Mavis"

檢查字串

endsWith()：判斷字串是否以特定字串結尾

判斷字串是否以特定字串結尾，回傳 Boolean 值。參數放入要判斷的特定字串。

// 注意：會判斷大小寫
let str = "Hello world";
str.endsWith("world")   // true
str.endsWith("World")   // false

startsWith()：判斷字串是否以特定字串開頭

判斷字串是否以特定字串開頭，回傳 Boolean 值。參數放入要判斷的特定字串。

// 注意：會區分大小寫
let str = "Hello world";
str.endsWith("Hello")   // true
str.endsWith("hello")   // false

includes()：判斷字串中是否包含特定子串

判斷字串中是否包含特定子串，回傳 Boolean 值，
參數中可放入兩個值：includes(判斷的特定字串,起始位置)

1. 要判斷的特定字串
2. （選填）起始位置，預設為 0

let str = "Hello world!!!!";
str.includes("world"); // true

// 填入第二個參數，設定起始位置
let str = "Hello world,nice to meet you!";
str.includes("world", 10);

indexOf()：尋找字串首次出現的位置

如果不包含，就回傳 -1。
參數中可放入兩個值：indexOf(判斷的特定字串,起始位置)

1. 要判斷的特定字串
2. （選填）起始位置，預設為 0

// 注意：會區分大小寫
let str="Hello world!";
str.indexOf("world"); //6
str.indexOf("World"); //-1

lastIndexOf()：從後尋找字串首次出現的位置

如果不包含，就回傳 -1。
參數中可放入兩個值：lastIndexOf(判斷的特定字串,起始位置)

1. 要判斷的特定字串
2. （選填）起始位置，預設為 0

// 注意：會區分大小寫
let str="Hello world!world!";
str.lastIndexOf("world"); //12
str.lastIndexOf("World"); //-1

// 填入第二個參數，設定起始位置
var str="Hello world!Hello world!";
str.lastIndexOf("world", 10);//6

檢查字串 - 可與正規表達式搭配

正規表達式是被用來匹配字串中字元組合的模式，若還不清楚使用方法，可以參考這篇文章。

search()：尋找與字串或正規表達式相同的值

尋找與正規表達式相同的值，回傳字串開始的索引值，沒找到回傳 -1，參數中放入要尋找找的值。

let str="Hello!world!Hello!world!"; 
str.search("world");//6

// 正規表達式
let str="Hello!world!Hello!world!"; 
str.search(/world/);//6

match()：尋找與字串或正規表達式相同的多個值

尋找與字串或正規表達式相同的多個值，回傳第一個成功的詳細資料，參數中放入要尋找找的值。

let str="Hello!world!Hello!world!"; 
str.match("world");//['world',index:6,....]

//  正規表達式
let str="Hello!world!Hello!world!"; 
str.match(/world/);//['world',index:6,....]

// 正規表達式：加上 g flag 會列出所有比對成功的字串
let str="Hello!world!Hello!world!"; 
str.match(/world/g);//['world', 'world']

replace()：替換與字串或正規表達式相同的值

尋找與字串或正規表達式相同的值，並替換第一個值。
參數中放入兩個值：replace(要體換掉的值,要替換上去的值)

1. 要替換掉的值
2. 要替換上去的值

// 正規表達式
let str="Hello!world!Hello!world!"; 
str.replace("world","mavis");//Hello!mavis!Hello!world!

// 正規表達式
let str="Hello!world!Hello!world!"; 
str.replace(/world/,"mavis");//Hello!mavis!Hello!world!

// 正規表達式：加上 g flag 可以替換所有符合的值
let str="Hello!world!Hello!world!"; 
str.replace(/world/g,"mavis");//Hello!mavis!Hello!mavis!

replaceAll()：替換與字串或正規表達式相同的多個值

尋找與字串或正規表達式相同的多個值，並替換所有值。
參數中放入兩個值：replaceAll(要替換掉的值,要替換上去的值)

1. 要替換掉的值
2. 要替換上去的值

let str="Hello!world!Hello!world!"; 
str.replaceAll("world","mavis");//Hello!mavis!Hello!mavis!

// 正規表達式
let str="Hello!world!Hello!world!"; 
str.replaceAll(/world/,"mavis");//Hello!mavis!Hello!mavis!

字串與陣列

split()：字串分割為陣列

參數中可放入兩個值：split(分割條件,回傳陣列最大長度)

1. （選填）隔開陣列中每個元素的字串，預設不改變字串
2. （選填）回傳陣列的最大長度，預設不考慮

let str="Hello!world";
let n = str.split(); //["Hello!world"]
n = str.split(""); //["H","e","l","l","o","!","w","o","r","l","d"]
n = str.split("!"); //["Hello","world"]

join()：陣列合併為字串

參數可（選填）放入隔開陣列中每個元素的字串：join(分割字串)，預設為,

let arr = ["c","a","t"];
let n = arr.join(); //"c,a,t"
n = arr.join("") //cat
n = arr.join("!"); //"c!a!t"