js中有三個截取字符的方法，分別是substring()、substr()、slice()，平時我們可能都用到過，但總是會對這些方法有點混淆，特別是substring()和substr()，連方法名都差不多，下面就具體來看一下區(qū)別。

相同點

這三個方法都可以對字符串進行截取，并且返回一個新的字符串，也就是不會對原字符串進行修改 。

這里 > 表示控制臺輸入，< 表示控制臺輸出，下同：

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substr(1,5)
< "12345"
> a
< "0123456789"  //沒有發(fā)生改變

不同點

這三個方法的不同之處在于參數(shù)不同。

substring

substring() 方法用于提取字符串中介于兩個指定下標之間的字符。

語法

string.substring(start,stop)

參數(shù)

說明

1.substring() 方法返回的子串包括 start 處的字符，但不包括 stop 處的字符。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substring(1,5)
< "1234"

2.如果參數(shù) start 與 stop 相等，那么該方法返回的就是一個空串(即長度為 0 的字符串)。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substring(1,1)
< ""

3.如果 start 比 stop 大，那么該方法在提取子串之前會先交換這兩個參數(shù)。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substring(5,1) 
//=>a.substring(1,5)
< "1234"

4.如果 start 和 stop 有負數(shù)，那么會把該參數(shù)自動轉(zhuǎn)為0，然后繼續(xù)上述規(guī)則。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substring(5,-1) 
//=> a.substring(5,0) 
//=> a.substring(0,5)
< "1234"

5.如果 start 和 stop 有正小數(shù)(負數(shù)直接進行第4條)，那么會把該參數(shù)向下取整，然后繼續(xù)上述規(guī)則。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substring(5,2.5) 
//=> a.substring(5,2) 
//=> a.substring(2,5)
< "234"

6.如果 start 和 stop 有字符串，那么會先進行parseInt()，如果轉(zhuǎn)換結(jié)果為NaN，那么就轉(zhuǎn)換為0，其余情況繼續(xù)上述規(guī)則。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substring(5,'2.5') 
//=> a.substring(5,2) 
//=> a.substring(2,5)
< "234"
> a.substring(5,'ss') 
//=> a.substring(5,NaN) 
//=> a.substring(5,0) 
//=> a.substring(0,5)
< "01234"

其他情況就沒有一一測試了，當然正常情況下盡量不要這么干，畢竟語法上已經(jīng)規(guī)定了是整數(shù)。

substr

substr() 方法可在字符串中抽取從 start 下標開始的指定數(shù)目的字符。

語法

string.substr(start,length)

參數(shù)

說明

該方法與substring()最大的區(qū)別在于第二個參數(shù)是你需要截取字符串的長度，而不是位置。

1.substr() 方法返回的子串從 start 處的字符開始(包括)往后截取length長度，如果超過最末端就到最末端結(jié)束。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substr(1,5)
< "12345"
> a.substr(1,15) 
// 只會到最末端，多了沒用
< "123456789"

2.start可以取負值，表示從字符串尾部往頭部開始數(shù)(從右到左，注意是從1開始，比如-1 指字符串中最后一個字符)，但是截取長度還是從左到右，如果超過最末端就到最末端結(jié)束。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substr(-4,2) 
// -4表示從右開始數(shù)第4個，就是'6'，然后取2個長度的字符串，就是'67'
< "67"

3.如果length為負值，那么會直接當成0處理，最終返回""。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substr(4,-2) 
//=> a.substr(4,0)
< ""

4.如果start或者length為小數(shù)，那么會截取小數(shù)部分。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substr(1.2,5.2) 
//=> a.substr(1,5)
< "12345"

5.如果 start 和 length 有字符串，那么會先進行parseInt()，如果轉(zhuǎn)換結(jié)果為NaN，那么就轉(zhuǎn)換為0，其余情況繼續(xù)上述規(guī)則。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.substr('aa','5') 
//=> a.substr(0,5)
< "01234"

slice

slice() 方法可提取字符串的某個部分，并以新的字符串返回被提取的部分。

語法

string.slice(start,end)

參數(shù)

說明

該方法的兩個參數(shù)均為位置坐標，和subtring比較像，區(qū)別就是該方法支持負數(shù)，并且不會交換位置，始終是從start到end，如果該區(qū)間不存在，那么返回''。

1.slice() 方法返回的子串包括 start 處的字符，但不包括end 處的字符。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.slice(1,5)
< "1234"

2.當start或者end為負值時，定位方式和substr一，從右往左數(shù)，從1開始。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.slice(1,-1)
//起始點從第1（包括）開始，結(jié)束點為從右往左數(shù)第1個（不包括）
< "12345678"

3.start到end的順序始終是從左到右，如果最終start的位置在end的右邊，那么返回''。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.slice(2,1)
//2所在的位置是'2'，1所在的位置是'1'，從2=>1，方向相反，返回為空
< ""
> a.slice(-2,1)
//-2所在的位置是'8'，1所在的位置是'1'，從8=>1，方向相反，返回為空
< ""
> a.slice(-2,-1)
//-2所在的位置是'8'，-1所在的位置是'9'，從8=>9，方向正常，返回為'8'
< "8"

4.其他情況和substring處理方式一致 。

//chrome控制臺
> var a = '0123456789'
< undefined
> a.slice('xx','5.5')
// => a.slice(0,5)
< "01234"

總結(jié)一下

從上面測試得出結(jié)論，substring不支持負值，其他兩種方式均支持負數(shù)表示，并且是從右邊第一位開始計數(shù)。

substr的第二個參數(shù)是長度，這是和其他兩種方式最大的不同之處。

slice的方向性比較強，永遠是從start=>end對應(yīng)左=>右。

以上結(jié)論均在最新谷歌瀏覽器上測試，IE和火狐未測試。

到此這篇關(guān)于詳解JS截取字符串的三個方法substring,substr,slice的文章就介紹到這了,更多相關(guān)JS截取字符串內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論