Unofficial logo from JSConf EU 2011

[筆記] JavaScript 內 substr, substring 和 slice 的分別

在JavaScript中,如果要在String字串中擷取子字串,我們可以用到substr, substring和slice三個方法。以下是三個方法的分別和例子。

格式

我們先看看三個方法的分別。

substr方法的第一個參數是子字串的「開始位置」,必需填寫;第二個參數是子字串的「長度」,可選擇填寫。第一個字符的位置是「0」,最尾一個字符的位置是「-1」。如果只填寫第一個參數,則代表擷取至字串的最尾。由於ECMAscript並沒有將substr方法納入標準,因此不建議使用。格式如下︰

stringObject.substr( start [, length ] );

substring方法的第一個參數是子字串的「開始位置」,必需填寫,只容許輸入正整數;第二個參數是子字串的「結束位置」,可選擇填寫,只容許輸入正整數。實際上最尾一個字符的位置是「end – 1」。格式如下︰

stringObject.substring( start [, end ] );

slice方法的第一個參數是子字串的「開始位置」,必需填寫,只容許輸入正整數;第二個參數是子字串的「結束位置」,可選擇填寫,只容許輸入正整數。實際上最尾一個字符的位置是「end – 1」。格式如下︰

stringObject.slice( start [, end ] );

簡單來說,substr方法是按長度擷取子字串。而substring方法和slice方法是按位置擷取子字串。

substring 和 slice 方法的分別

substring和slice方法的分別是slice方法不支援向前擷取子字串。意思即是如果「結束位置」是小於「開始位置」,slice方法並不會向前擷取子字串,slice方法會返回空白字串。

例子

以下是三個方法的例子。

var myText = "We all love FoolEgg.com very much!";

var myTextSubstr = myText.substr(3,10);
// myTextStr 的字串是「"all love F"」

var myTextSubstring = myText.substring(3,10);
// myTextSubstring 的字串是「"all lov"」

var myTextSlice = myText.slice(3,10);
// myTextSlice 的字串是「"all lov"」

var myTextSubstr2 = myText.substr(10,3);
// myTextSubstr2 的字串是「"e F"」

var myTextReverseSubstring = myText.substring(10,3);
// myTextReverseSubstring 的字串是「"all lov"」

var myTextReverseSlice = myText.slice(10,3);
// myTextReverseSlice 的字串是「""」