js中 substr(), substring(), slice()的区别

1、做用

　　三者都是基于原字符串建立新字符串的方法。

　　接收一到两个参数，第一个参数截取字符串的开始位置（字符下标，从0开始），第二个参数因方法不一样而不一样，后面不一样点会说到。

　　另外，三个方法都不会修改原字符串的值。

2、相同点

• 均可以传入一个或两个参数
• 只传入一个参数时，都表示从指定下标，截取字符串长度，直到字符串最后一个字符

var str = 'hello sarahshine!';

console.log(str.slice(3));          // 'lo sarahshine!'
console.log(str.substring(3));      // 'lo sarahshine!'
console.log(str.subtr(3));          // 'lo sarahshine!'

 

3、不一样点

2.1   传入两个参数时，第二个参数表明的意义不一样

• slice ( ) 和 substring ( ) 的第二个参数，都表示截取字符串的结束位置
• substr ( ) 的第二个参数表明的是，要截取的字符串位数

var str = 'hello sarahshine!';

console.log(str.slice(3,7));           // 'lo s'
console.log(str.substring(3,7));       // 'lo s'
console.log(str.substr(3,7));          // 'lo sara'

 

2.2  传入的参数是负数

• slice ( )  会把全部的负数参数加上字符串的长度值，如：str.slice(-3)   至关于 str.slice(14)
• substring ( ) 会把全部的负数参数都转为0
• substr ( ) 会把第一个参数的负值加上字符串的长度值，第二个参数的负值转为0   （毕竟第二个参数是要截取的字符串长度，总不能为负数吧）

var str = 'hello sarahshine!';  //length = 17
            
//只传入一个负数
console.log(str.slice(-3));     // 'ne!'                至关于str.slice(14)
console.log(str.substring(-3)); // 'hello sarahshine!'  至关于str.substring(0)
console.log(str.substr(-3));    // 'ne!'                至关于str.substr(14)
            
//传入两个负数
console.log(str.slice(-3, -1));     // 'ne'          至关于str.slice(14,16)
console.log(str.substring(-3, -1)); // ''            至关于str.substring(0,0)
console.log(str.substr(-3, -1));    // ''            至关于str.substr(14,0)
            
//传入一正一负
console.log(str.slice(3, -4));     // 'lo sarahsh'   至关于str.slice(3,13)
console.log(str.substring(3, -4)); // 'hel'          至关于str.substring(3,0)  即(0，3)
console.log(str.substr(3, -4));    // ''             至关于str.substr(3,0)

 

以上都出自《javascript高级程序设计》