// 首先定义一个字符串 var str1 = 'Hello World!'
来看一下所需要传递的参数
slice(start,end)
substr(start,length)
subtring(start,stop)
注意：由于字符串是不可变的类型，所以这三个方法的返回值都是新的字符串
可以看出第一个参数都是start，所以
传入一个参数的时候
当这个参数是非负值 或者不传递参数时，返回的结果都一样console.log(str1.slice(4)) // o World!console.log(str1.substr(4)) // o World!console.log(str1.substring(4)) // o World!console.log(str1.slice(0)) // Hello World!console.log(str1.substr(0)) // Hello World!console.log(str1.substring(0)) // Hello World!console.log(str1.slice()) // Hello World!console.log(str1.substr()) // Hello World!console.log(str1.substring()) // Hello World!
注意，如果这个参数如果大于过等于字符串的长度，则返回值为空字符串
console.log(str1.slice(12)) // ""console.log(str1.substr(12)) // ""console.log(str1.substring(12)) // ""
当传递的参数为负值的时候：
console.log(str1.slice(-4)) // rld!console.log(str1.substr(-4)) // rld!console.log(str1.substring(-4)) // Hello World!console.log(str1.substri ng(-6)) // Hello World!console.log(str1.slice(-12)) // Hello World!console.log(str1.substr(-12)) // Hello World!console.log(str1.substring(-12)) // Hello World!
由上述例子可以看出，如果传递的负值参数的绝对值大于或等于该字符串的长度，则会返回完整的字符串；如果传递的负值参数的绝对值小于该字符串的长度，slice() 和substr() 方法都会根据该值大小，倒叙截取字符串的长度，而对于substring()， 则无论传入的是什么负值参数，都是返回完整的字符串。
当传入两个参数时
slice(start, end) 根据传入参数均是下标，具体情况如下：
// 相同符号的参数，如果第二个参数小于等于第一个参数，则返回空字符串，比如：console.log(str1.slice(-1, -4)) // ""console.log(str1.slice(5, 3)) // ""// 第二个参数为0，或第一个参数大于等于字符串的长度，或第二个参数小于等于长度的负数（比如长度为12，第二个参数小于等于-12），则返回是空字符console.log(str1.slice(3, 0)) // ""console.log(str1.slice(-5, 0)) // ""console.log(str1.slice(12, 15)) // ""console.log(str1.slice(-15, -12)) // ""// 第二个参数大于第一个参数，则截取他们区间的元素，如：console.log(str1.slice(-4, -1)) // "rld"console.log(str1.slice(3, 5)) // "lo"// 不同符号的参数，正参数不变，负参数计算与长度的和，同样进行第二个参数与第一个参数进行比较，比如：console.log(str1.slice(3,-4)) // 相当于 str1.slice(3, 8)console.log(str1.slice(-5, 11)) // 相当于 str1.slice(7, 11)console.log(str1.slice(6, -11)) // 相当于 str1.slice(6, 1)
substr(start, length) 第一个参数是下标，第二个参数是要截取的长度
// 如果第二个参数为非正数，则一定返回空字符串console.log(str1.substr(4, -2)) // ""console.log(str1.substr(3, -14)) // ""console.log(str1.substr(-4, 0)) // ""console.log(str1.substr(5, 0)) // ""// 如果第一个参数为负数，则以该参数与字符串的长度的和为起始下标，截取第二个参数长度，直到截取超过长度范围console.log(str1.substr(-4, 3)) // 相当于 str1.substr(8,3) 即为 'rld'console.log(str1.substr(-3, 5)) // 相当于str1.substr(9, 5) 即为 'ld!'
substring(start, stop) 两个参数都是下标，那么这个方法与slice(start, end)的区别在哪呢？
// 在传入的参数为正数的时候，两个方法的返回值是一样的，如：console.log(str1.slice(4)) // 'o World!'console.log(str1.substring(4)) // 'o World!'console.log(str1.slice(3, 6)) // 'lo'console.log(str1.substring(3, 6)) // 'lo'// 在传入的参数为负数的时候，substring 会把负数参数换算成 0，如：console.log(str1.substring(-3)) // 相当于 str1.substring(0) 即为 'Hello World!'// 如果是两个参数中有一个为负数的话，则会将该负数参数换算成 0，并把该参数作为起始位置，另一个非负参数，作为终止位置，比如：console.log(str1.substring(-4, 5)) // 相当于 str1.substring(0, 5) 即为 'Hello'console.log(str1.substring(5, -6)) // 相当于 str1.substring(0, 5) 即为 'Hello'
参考资料：
JS中substr()，substring()，slice()区别
javascript中String类的subString()方法和slice()方法