slice()，substring()和substr()的異同

同

1. 三個方法都是對字符串的截取操做，返回被操做的字符串，不會修改字符串自己；
2. 都接受一或兩個參數，第一個參數都爲開始的位置；
3. 只有一個參數且爲正數的狀況下返回的結果相同；

var str = "12345678";
console.log(str.slice(3)); // "45678"
console.log(str.substring(3)); // "45678"
console.log(str.substr(3)); // "45678"

異

1. 第二個參數含義不一樣

slice()和substring()第二個參數含義都爲指定字符串最後一個字符後面的位置，
而substr()第二個參數含義爲返回的字符數量

var str = "12345678";
console.log(str.slice(3,4)); // "4"
console.log(str.substring(3,4)); // "4"
console.log(str.substr(3,4)); // "4567"

2. 參數爲負數

• slice()會把負數與字符串長度相加

var str = "12345678";
console.log(str.slice(-3)); // 至關於 scice(5)  =>  "678"
console.log(str.slice(-3,7)); // 至關於 scice(5,7)  =>  "67"
console.log(str.slice(3,-3)); // 至關於 scice(3,5)  =>  "45"
console.log(str.slice(-5,-3)); // 至關於 scice(3,5)  =>  "45"

• substring()會把負數轉換爲0

var str = "12345678";
console.log(str.substring(-3)); // 至關於 substring(0)  =>  "12345678"
console.log(str.substring(-3,7)); // 至關於 substring(0,7)  =>  "1234567"
console.log(str.substring(-5,-3)); // 至關於 substring(0,0)  =>  ""

• substr()第一個參數爲負數會把負數與字符串長度相加和slice()相同，第二個參數爲負數返回空字符串

var str = "12345678";
console.log(str.substr(-3)); // 至關於 substr(5)  =>  678
console.log(str.substr(5,-3)); // 至關於 substr(5,0)  =>  ""

3. 兩個參數位置顛倒

意思爲將較大的數做爲開始位置，而將較小的數做爲結束位置，
這個不一樣點只在slice()和substring()才存在，
substr()只有一個參數表示位置，還有一個表示長度，因此不存在這個問題

• slice()會返回空字符串

var str = "12345678";
console.log(str.slice(5,3)); // ""
console.log(str.slice(-3,3)); // 至關於 scice(5,3)  =>  ""
console.log(str.slice(7,-3)); // 至關於 scice(7,5)  =>  ""

• substring()會調換兩個參數的位置

var str = "12345678";
console.log(str.substring(5,3)); // 至關於 substring(3,5)  =>  "45"
console.log(str.substring(-3,3)); // 至關於 substring(0,3)  =>  "123"
console.log(str.substring(7,-3)); // 至關於 substring(7,0)  => substring(0,7)  => "1234567"

總結

來張表吧

本篇如能對您有所幫助，實在是感到榮幸。若有不合理之處也請你們多多指點。