Try   HackMD

[JavaScript] 擷取字串 substr(), substring(), slice()的區別

tags: JavaScript

相同點

  • 都可以傳入一個或兩個參數
  • 只傳入一個參數時,都表示從指定下標,截取字符串長度,直到字符串最後一個字符
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!‘

不同點

傳入兩個參數時,第二個參數代表的意義不同

  • 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‘

傳入的參數是負數

  • 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)