细究js字符串的三大截取方法:slice substring substr

js字符串的三大截取方法参数不合法时的处理

在这里插入代码片js字符串的三大截取方法是slice、substring 和 substr，这三个方法的效果是从字符串中截取一定长度的子串出来，他们功能相似，但是用起来常常让人摸不着头脑。当参数合法时他们常常表现得很乖。当参数不合法时他们又是各有自己的处理方式，一些细节常常让人达不到想要的效果。

slice方法

slice方法的参数有两个，第一个是起始位置start，另一个是结束位置end。其中end是可选参数，可以省略。下面是在火狐中的一段代码。从上往下一次解释：

1. 当start大于end时，返回空。
2. 当start等于end时，返回空。
3. 当start小于0时，返回空。
4. 当end为NaN时，返回空。
5. 当start为NaN时，设为0.
6. 当end小于0 时，加长度。
7. 当参数大于长度，设为长度。

var str = "abcdefghijklmn";
console.log(str.slice(5,1));
console.log(str.slice(2,2));
console.log(str.slice(-4,1));
console.log(str.slice(1,NaN));
console.log(str.slice(NaN,5));
console.log(str.slice(0,-1));
console.log(str.slice(1,20));
//结果




abcde 
abcdefghijklm
bcdefghijklmn

这是一个完全没有规律可言的细节把握，笔者为了记忆编了一个顺口溜：slice情况较复杂，大小颠倒相等空，开小闭非数也空。开非数他先设0，闭小0它只加长度，参数大界设长度。 当然，小编也是记了很久，多数情况下要现场查。

subString方法

subString方法的参数与slice完全相同，有start和end。但是start处理非法参数时有试图想要尽量理解用户的输入去做自己的处理。下面同样是火狐处理的一些代码结果。

1. 若有NaN和负数，先设为0。
2. 若有参数大于length，设为length。
3. 若start大于end，颠倒参数。

console.log(str.substring(0,20));
console.log(str.substring(20,0));
console.log(str.substring(-1,5));
console.log(str.substring(NaN,5));
console.log(str.substring(5,0));

// 结果
abcdefghijklmn
abcdefghijklmn 
abcde 
abcde 
abcde

subString总是试图将非法参数，即小于零或者NaN的参数转换成合法参数0。将大于length的非法参数设为length。将不合理的参数，如start大于end的合法参数进行对换调整为合理参数。

subStr方法

subStr方法与上边两个方法的参数不同。这个方法的第一个参数时start，第二个参数时num，表示个截取个数。这个函数主要是第一个参数的处理.

1. 当start小于0 ，加长度。
2. 当start小于0，加长度依旧小于零，设为0.
3. 当start为NaN，设为0 。
4. 当start大于length，返回空。

var str="abcdefghijklmn";
console.log(str.substr(-1,5));
console.log(str.substr(-20,5));
console.log(str.substr(NaN,5));
console.log(str.substr(20,5));

//结果
n
abcde 
abcde

下边真的可以不看 -----

想学习一些前端的书籍吗，我都帮你整理好啦！评论打出你想读的书，给你最全的笔记干货

超级全的前端知识，面试必备、系统复习必备哟哟哟

有想法评论提出哈，欢迎交流，小编也是渣渣一枚呢～一起进步呗

这次真的可以不看 -----

点个收藏呗，要不赞一个呗，小编手都敲累了，但还是持续加更呢～