3個 JavaScript 字符串截取方法

在 JavaScript 中,可以使用 substr()、slice() 和 substring() 方法截取字符串。在JavaScript中字符串操作的技巧可以閱讀下列文章:
substring()
substring() 方法返回一個字符串在開始索引到結束索引之間的一個子集,或從開始索引直到字符串的末尾的一個子集。語法如下:
str.substring(indexStart[, indexEnd])
參數說明:
indexStart:需要截取的第一個字符的索引,該索引位置的字符作為返回的字符串的首字母。indexEnd:可選。一個0到字符串長度之間的整數,以該數字為索引的字符不包含在截取的字符串內。
如果 startIndex 大于 endIndex,則會交換它們的位置。來看一段示例代碼:
let str = "深耕WEB開發10+年,擁有一顆工匠的心";
console.log(str.substring(7)); // 10+年,擁有一顆工匠的心
console.log(str.substring(0, 5)); // 深耕WEB
console.log(str.substring(7, 5)); // 開發
console.log(str.substring(5, 5)); // 空
substr()
substr() 方法返回一個字符串中從指定位置開始到指定字符數的字符。語法如下:
str.substr(start[, length])
第一個參數是截取開始的位置,第二個參數是截取的長度。如下代碼:
let str = "深耕WEB開發10+年,擁有一顆工匠的心";
let result = str.substr(1, 4);
console.log(result); // 耕WEB
上述代碼的 1 表示從第二個字符開始截取,4 表示截取的長度為 4 個字符。
substr()方法在截取字符串時是基于字符位置的,如果截取長度超過了字符串的長度,它會一直截取到字符串的末尾。如果第一個參數是負數,則從字符串的末尾開始計數。
如果可以的話,建議使用 substring() 來取代 substr()。
slice()
slice() 方法提取某個字符串的一部分,并返回一個新的字符串,且不會改動原字符串,與 substring() 方法類似。語法如下:
str.slice(startIndex, endIndex)
其中,startIndex 表示要截取的子字符串的起始位置(包含該位置),endIndex 表示要截取的子字符串的結束位置(不包含該位置)。如果只傳入 startIndex,則會從該位置一直截取到字符串末尾。如果 startIndex 大于 endIndex,則會返回空字符串。例如:
let str = "深耕WEB開發10+年,擁有一顆工匠的心";
console.log(str.slice(7)); // 10+年,擁有一顆工匠的心
console.log(str.slice(0, 5)); // 深耕WEB
console.log(str.slice(7, 5)); // ""
console.log(str.slice(5, 5)); // ""
substring() 和 substr() 的區別
substring() 和 substr() 都是截取字符串的方法,但它們有以下區別:
- 參數不同:
substring()方法的第一個參數是起始位置,第二個參數是終止位置(不包括該位置的字符);substr()方法的第一個參數是起始位置,第二個參數是截取的長度。 - 負數處理不同:
substring()方法不接受負數參數,如果傳入負數,會被自動轉換為0;substr()方法可以接受負數參數,表示倒數計數。 - 返回值不同:
substring()方法返回從起始位置到終止位置之間的字符;substr()方法返回從起始位置開始指定長度的字符。
ES6中新增了
slice()方法,但它和substring()方法非常相似,也是接受起始位置和終止位置作為參數,不同之處是slice()方法可以接受負數參數,表示從字符串末尾開始計數。substr()雖然沒有被完全遺棄,但還是建議使用substring()來取代substr()。