JavaScript中String的slice()，substr()，substring()三者區(qū)別

共同之處

從給定的字符串中截取片段，并返回全新的這片段的字符串對象，且不會(huì)改動(dòng)原字符串。

具體不同之處

slice()

str.slice(beginIndex[, endIndex]) 參數(shù)描述

beginIndex	從該索引（以 0 為基數(shù)）處開始提取原字符串中的字符（包含）。如果值為負(fù)數(shù)，會(huì)被當(dāng)做 strLength + beginIndex 看待，這里的strLength 是字符串的長度（例如， 如果 beginIndex 是 -3 則看作是：strLength - 3）
endIndex	可選。在該索引（以 0 為基數(shù)）處（該索引下有字符，不包含）結(jié)束提取字符串。如果省略該參數(shù)，slice() 會(huì)一直提取到字符串末尾。如果該參數(shù)為負(fù)數(shù)，則被看作是 strLength + endIndex，這里的 strLength 就是字符串的長度(例如，如果 endIndex 是 -3，則是, strLength - 3)。

---

描述：

slice() 從一個(gè)字符串中提取字符串并返回新字符串。在一個(gè)字符串中的改變不會(huì)影響另一個(gè)字符串。也就是說，slice 不會(huì)修改原字符串（只會(huì)返回一個(gè)包含了原字符串中部分字符的新字符串）。

slice() 提取的新字符串包括beginIndex但不包括 endIndex。下面有兩個(gè)例子。

例 1：str.slice(1, 4) 提取第二個(gè)字符到第四個(gè)字符（被提取字符的索引值（index）依次為 1、2，和 3）。

例 2：str.slice(2, -1) 提取第三個(gè)字符到倒數(shù)第一個(gè)字符。

---

例子：

var str1 = 'The morning is upon us.', // str1 的長度 length 是 23。str2 = str1.slice(1, 8),str3 = str1.slice(4, -2),str4 = str1.slice(12),str5 = str1.slice(30); console.log(str2); // 輸出：he morn console.log(str3); // 輸出：morning is upon u console.log(str4); // 輸出：is upon us. console.log(str5); // 輸出：""//傳入了負(fù)值作為索引 var str = 'The morning is upon us.'; str.slice(-3); // 返回 'us.' str.slice(-3, -1); // 返回 'us' str.slice(0, -1); // 返回 'The morning is upon us'

substr()

str.substr(start[, length])

警告： 盡管 String.prototype.substr(…) 沒有嚴(yán)格被廢棄 (as in “removed from the Web standards”), 但它被認(rèn)作是遺留的函數(shù)并且可以的話應(yīng)該避免使用。它并非JavaScript核心語言的一部分，未來將可能會(huì)被移除掉。如果可以的話，使用 substring() 替代它.

參數(shù)描述

start	開始提取字符的位置。如果為負(fù)值，則被看作 strLength + start，其中 strLength 為字符串的長度（例如，如果 start 為 -3，則被看作 strLength + (-3)）。
length	可選。提取的字符數(shù)。

---

描述：

start 是一個(gè)字符的索引。首字符的索引為 0，最后一個(gè)字符的索引為 字符串的長度減去1。substr 從 start 位置開始提取字符，提取 length 個(gè)字符（或直到字符串的末尾）。

如果 start 為正值，且大于或等于字符串的長度，則 substr 返回一個(gè)空字符串。

如果 start 為負(fù)值，則 substr 把它作為從字符串末尾開始的一個(gè)字符索引。如果 start 為負(fù)值且 abs(start) 大于字符串的長度，則 substr 使用 0 作為開始提取的索引。

如果 length 為 0 或負(fù)值，則 substr 返回一個(gè)空字符串。如果忽略 length，則 substr 提取字符，直到字符串末尾。

---

例子：

var str = "abcdefghij";console.log("(1,2): " + str.substr(1,2)); // (1,2): bc console.log("(-3,2): " + str.substr(-3,2)); // (-3,2): hi console.log("(-3): " + str.substr(-3)); // (-3): hij console.log("(1): " + str.substr(1)); // (1): bcdefghij console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab console.log("(20, 2): " + str.substr(20,2)); // (20, 2):

substring()

str.substring(indexStart[, indexEnd]) 參數(shù)描述

indexStart	需要截取的第一個(gè)字符的索引，該索引位置的字符作為返回的字符串的首字母。
indexEnd	可選。一個(gè) 0 到字符串長度之間的整數(shù)，以該數(shù)字為索引的字符不包含在截取的字符串內(nèi)。

---

描述：
substring 提取從 indexStart 到 indexEnd（不包括）之間的字符。特別地：

• 如果 indexStart 等于 indexEnd，substring 返回一個(gè)空字符串。
• 如果省略 indexEnd，substring 提取字符一直到字符串末尾。
• 如果任一參數(shù)小于 0 或?yàn)?NaN，則被當(dāng)作 0。
• 如果任一參數(shù)大于 stringName.length，則被當(dāng)作 stringName.length。
• 如果 indexStart 大于 indexEnd，則 substring 的執(zhí)行效果就像兩個(gè)參數(shù)調(diào)換了一樣。見下面的例子。

---

例子：

var anyString = "Mozilla";// 輸出 "Moz" console.log(anyString.substring(0,3)); console.log(anyString.substring(3,0)); console.log(anyString.substring(3,-3)); console.log(anyString.substring(3,NaN)); console.log(anyString.substring(-2,3)); console.log(anyString.substring(NaN,3));// 輸出 "lla" console.log(anyString.substring(4,7)); console.log(anyString.substring(7,4));// 輸出 "" console.log(anyString.substring(4,4));// 輸出 "Mozill" console.log(anyString.substring(0,6));// 輸出 "Mozilla" console.log(anyString.substring(0,7)); console.log(anyString.substring(0,10));//下面一個(gè)例子運(yùn)用了 String.length 屬性去獲取指定字符串的倒數(shù)元素。 //顯然這個(gè)辦法更容易記住，因?yàn)槟悴辉傧裆厦婺莻€(gè)例子那樣去記住起始位置和最終位置。// Displays 'illa' the last 4 characters var anyString = 'Mozilla'; var anyString4 = anyString.substring(anyString.length - 4); console.log(anyString4);// Displays 'zilla' the last 5 characters var anyString = 'Mozilla'; var anyString5 = anyString.substring(anyString.length - 5); console.log(anyString5);

參考資料

String.prototype.slice() - JavaScript | MDN

String.prototype.substr() - JavaScript | MDN

String.prototype.substring() - JavaScript | MDN

JavaScript中substr()，substring()，slice()區(qū)別

總結(jié)

以上是生活随笔為你收集整理的JavaScript中String的slice()，substr()，substring()三者区别的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。