JS学习36：字符串的slice/substring/substr

深藏阁楼爱情的钟 2022-07-15 11:16 151阅读 0赞

# 1、字符串的位置 #

直接看图：

![20131121115601.jpg][]

# 2、字符串的slice #

slice的意思是切片、切割。同样，在字符串中slice就是起到切割的作用。

在js中，slice方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。最多接收2个参数：

*  参数1（可选）：截取字符串的开始位置。若未指定，则默认为字符串开始位置；若为负数，则从字符串的尾部开始算起的位置，-1 指字符串的最后一个字符，-2 指倒数第二个字符，以此类推。
 *  参数2（可选）：截取字符串的结束位置之前。若未指定，则默认为字符串结尾位置；若为负数，则从字符串的尾部开始算起的位置，-1表示最后一个字符，-2表示倒数第二个字符，以此类推。

如果不符合参数规则或无法截取，则返回空字符串。

例如：

var str = "hello @云淡然"; console.log(str.slice()); // "hello @云淡然" console.log(str.slice(1)); // "ello @云淡然" console.log(str.slice(1, 2)); // "e" console.log(str.slice(1, -2)); // "ello @云" console.log(str.slice(-1)); // "然" console.log(str.slice(-2, -1)); // "淡" console.log(str.slice(-1, -2)); // ""

# 3、字符串的substring #

substring意思是子串，字符串的子串，与slice类似。同样使用方法也非常的类似。

在js中，substring方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。最多接收2个参数：

*  参数1（可选）：提取字符串的开始位置，负数会自动转为0。
 *  参数2（可选）：提取字符串的结束位置之前，负数会自动转为0。

如果不符合参数规则或无法截取，则返回空字符串。

例如：

var str = "hello @云淡然"; console.log(str.substring()); // "hello @云淡然" console.log(str.substring(1)); // "ello @云淡然" console.log(str.substring(1, 2)); // "e" console.log(str.substring(1, -2)); console.log(str.substring(1, 0)); console.log(str.substring(0, 1)); // "h" console.log(str.substring(-1)); console.log(str.substring(0)); // "hello @云淡然" console.log(str.substring(-2, -1)); console.log(str.substring(0, 0)); // "" console.log(str.substring(-1, -2)); console.log(str.substring(0, 0)); // ""

注意：如果参数1的数值大于参数2的数值，则交换两个参数。

如：

var str = "hello @云淡然"; str.substring(1, -2); // 第2个参数小于0，则转为0 str.substring(1, 0); // 第1个参数大于第2个参数，交换参数 str.substring(0, 1); // "h"

# 4、字符串的substr #

substr是substring的缩写，功能与substring有些不一样，可想而知，substr是为了妥协才想出来这么一个让人混淆的名称。同样的情况，在javascript中出现的情况真不少。

在js中，substr方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。最多接收2个参数：

*  参数1（可选）：截取字符串的开始位置。若未指定，则默认为字符串开始位置；若为负数，则从字符串的尾部开始算起的位置，-1 指字符串的最后一个字符，-2 指倒数第二个字符，以此类推。
 *  参数2（可选）：截取字符串的长度，必须为正数。若未指定，则默认为字符串的剩余长度。

如果不符合参数规则或无法截取，则返回空字符串。

例如：

var str = "hello @云淡然"; console.log(str.substr()); // "hello @云淡然" console.log(str.substr(1)); // "ello @云淡然" console.log(str.substr(1, 2)); // "el" console.log(str.substr(1, -2)); // "" console.log(str.substr(-1)); // "然" console.log(str.substr(-2, -1)); // "" console.log(str.substr(-1, -2)); // ""

# 5、参考资料 #

*  [http://javascript.ruanyifeng.com/stdlib/string.html][http_javascript.ruanyifeng.com_stdlib_string.html]
 *  [http://www.w3school.com.cn/js/jsref\_slice\_string.asp][http_www.w3school.com.cn_js_jsref_slice_string.asp]
 *  [http://www.w3school.com.cn/js/jsref\_substring.asp][http_www.w3school.com.cn_js_jsref_substring.asp]
 *  [http://www.w3school.com.cn/js/jsref\_substr.asp][http_www.w3school.com.cn_js_jsref_substr.asp]

[20131121115601.jpg]: http://qianduanblog.com/uploads/2013/11/20131121115601.jpg
[http_javascript.ruanyifeng.com_stdlib_string.html]: http://javascript.ruanyifeng.com/stdlib/string.html
[http_www.w3school.com.cn_js_jsref_slice_string.asp]: http://www.w3school.com.cn/js/jsref_slice_string.asp
[http_www.w3school.com.cn_js_jsref_substring.asp]: http://www.w3school.com.cn/js/jsref_substring.asp
[http_www.w3school.com.cn_js_jsref_substr.asp]: http://www.w3school.com.cn/js/jsref_substr.asp