语法：
str.slice(start, end);
起始下标(start) <= 截取的范围 < 结束下标(end)
包括起始下标对应字符, but不包括结束下标;
来个'串'
letstr ='小贝老师真漂亮!';
当只传一个参数的时候：默认为start，(start <= 范围 < str.length)
console.log(str.slice(1));// 贝老师真漂亮!
当传两个参数的时候：截取的字符串为： start <= 截取范围 < end
console.log(str.slice(1,4));// 贝老师
2. String.substring
语法：
str.substring(start, end);
起始下标 <= 截取的范围 < 结束下标
包括起始下标对应字符, 但不包括结束下标;
也来个'串'
letstr ='小贝老师真漂亮!';
当只传一个参数的时候：默认为start，(start <= 范围 < str.length)
console.log(str.substring(1));// 贝老师真漂亮!
当传两个参数的时候：截取的字符串为： start <= 截取范围 < end
console.log(str.substring(1,4));// 贝老师
3. String.substr
语法：
str.substr(start, length);
起始下标<= 截取的范围 <= 自定义截取的长度
substr方法更直截（直接定义长度）
再来个'串'
letstr ='小贝老师真漂亮!';
当只传一个参数的时候：默认为start， （start<= 截取范围 < str.length）
console.log(str.substr(1));// 贝老师真漂亮!
当传两个参数的时候：截取的字符串为： (start <= 截取范围 <= 自定义截取的长度)
console.log(str.substr(1,4));// 贝老师真
熟悉的姿势咱们都用过了，试试不常用的姿势了吧~
要进入高潮啦~ 忍住啦~
一. String.slice() 遇上了'辣妹子'(负数)该如何是否？
1. 当起始值start为负数的时候：
letstr ='小贝老师真漂亮!';console.log(str.slice(-1));// !console.log(str.slice(-2));// 亮!console.log(str.slice(-3));// 漂亮!
结果为：
反向下标截取
反向的下标<= 截取范围 < 字符串长度
2. 当反向下标的绝对值大于或等于长度的时候呢？
console.log(str.slice(-str.length));// 小贝老师真漂亮!console.log(str.slice(-str.length -1));// 小贝老师真漂亮!console.log(str.slice(-str.length -2));// 小贝老师真漂亮!
当反向下标的绝对值大于或等于字符串长度，仿佛会置为0，结果截取到了字符串结束
来张纸巾(粗糙的画画)擦擦汗吧~ 反向下标是个啥？
反向下标.PNG
反向的下标对应的字符 ~ 截取至字符串结束
反向下标的绝对值大于了字符串长度会置为0，然后再开始截取
3. '软妹子'(正)和'辣妹子'(负)一起上
3.1 起始下标为正数 <= 截取范围 < 结束下标为负数
// 负数的结束下标未超越正数的起始下标console.log(str.slice(1,-2));// 贝老师真漂console.log(str.slice(2,-4));// 老师console.log(str.slice(2,-5));// 老// 相同位置 正负下标对应同一个字符console.log(str.slice(2,-6));// ''// 负数的结束下标超越正数的起始下标console.log(str.slice(2,-7));// ''
会发现只要end在start右侧才会正常的截取;
当end与start重合或者在start的左侧则变成了空字符串
说明违反了 start <= 截取范围 < end规则（截取的方向是从左至右的），返回的是空字符串
3.2 起始下标为负数<= 截取范围 < 结束下标为正数
当start为负数与0重合或在0的左侧，则会置为0，而重合返回是空字符串，按照start <= 截取范围 < end规则
// 负数的起始下标 -> 0的结束下标console.log(str.slice(-9,0));// ''// 负数的起始下标 === 0的结束下标console.log(str.slice(-8,0));// ''// 负数的起始下标 -> 正数的结束下标console.log(str.slice(-8,2));// '小贝'console.log(str.slice(-8,8));// '小贝老师真漂亮!'
当然还得测试一下end在start左侧的时候
结果：返回的是空字符串，（可以看出截取的方向是从左往右: start -> end）
// 负数的起始下标 -> 正数的结束下标 (end在start左侧)console.log(str.slice(-3,2));// ''
二. String.Substring() 遇上了'辣妹子'(负数)又该如何是好？
1. 当起始下标为'辣妹子'(负数)的时候
负数的起始值果断置0~
substring-负数.PNG
substring-负数结果.PNG
2.Substring遇上一正一负的时候
2.1 当起始下标为'辣妹子'(负数)，结束下标为'软妹子'（正数）
哈哈，果断的man！负数都置为0了，真好~
substring-2.PNG
substring-2-res.PNG
2.2当起始下标为'辣妹子'(负数)，结束下标也为'辣妹子'(负数)的时候~
钢铁直男的果断，负数的结束下标也置0了，导致都是空字符串
substring-3.PNG
substring-3-res.PNG
2.3难不成这个东东就这么硬气吗？遇上负数这个妹子就一点都不懂得变通吗？
请看当起始下标为正数，结束下标为妹子(负数)
substring-4.PNG
substring-4-res.PNG
哈哈，差点单身一辈子了吧~
Substring方法：
当结束下标为负数则置为0，然后与起始下标互换位置;
起始下标正数摇身一变成为了结束下标截取的;
方向依然从左往右
三、给String.substr()一次机会-当它遇上'辣妹子'(负数)又是什么情况呢？
1. 起始值可以为负数，but自定义截取的长度请不要定义为负数
当起始下标为负数时，采取反向下标对应
当截取的长度设置为0或者是负数的时候则返回空字符串
subStr.PNG
subStr-res.PNG
爽过之后，温存一下~
回头看看用过的纸巾~
先记住这个反向下标，然后总结下面几点，咱们就不会混淆啦~
反向下标.PNG
1、 Slice
a) 注意截取顺序： 从左至右
b) 结束下标出现在起始下标左侧则返回空字符串
2、 Substring
a) 负数下标会置零，
b) start为正数，end为负数，end置零后会与start互换位置
3、 substr
a) 长度不能为负数
b) Start可为负数，可参考slice方法start为负数
作者：L H
网友评论