深入探討JavaScript String物件_基礎知識

String 字串物件

1. 介紹

　　String 對象，對字串進行操作，如：截取一段子字串、尋找字串/字元、轉換大小寫等等。

2. 定義方式

2.1 new String(Value) 建構子：傳回內容為Value的String物件
參數：

①value {String} ：字串

傳回值：

{String物件} 傳回一個內容為Value的String物件

範例：

複製程式碼 程式碼如下:

var demoStr = new String('abc');
console.log(typeof demoStr); // => object
console.log(demoStr); // => abc

2.2 直接賦值(建議)
例：

複製程式碼 程式碼如下:

var demoStr = 'abc';
console.log(typeof demoStr); // string
console.log(demoStr); // => abc

3. 實例屬性

3.1 length ：傳回字串中的字元數

複製程式碼 程式碼如下:

var s = 'abc';
console.log(s.length); // => 3
console.log('新年快樂'.length); // => 4 ：一個中文字元也計算為1個數量
console.log(''.length); // => 0 ：空字串回傳0

4. 實例方法

注意：字串的實例方法不會改變字串的本身，只回傳操作後的結果。

4.1 charAt(index) ：傳回字串中指定位置的字符，編號從0開始，若傳入個不存在的數值，就傳回空字串
參數：

①index {int} ：位置索引，從0開始計算

傳回值：

{string} 傳回字串中指定位置的字元；若傳入個不存在的位置數值，則傳回一個空字串

範例：

複製程式碼 程式碼如下:

var s = 'abc';
console.log(s.charAt(1)); // => b ：傳回位置為1的字元
console.log(s); // => 不影響原來的陣列
console.log(s.charAt(5)); // => '' ：取得一個不存在位置的字符，傳回一個長度為0的空字串

4.2 charCodeAt(index) ：傳回字串中指定位置字元的Unicode編碼
參數：

①index {int} ：位置索引，從0開始計算

傳回值：

{number}  傳回字串中指定位置字元的Unicode編碼；若傳入個不存在的位置數值，則傳回NaN

範例：

複製程式碼 程式碼如下:

var s = 'abc';
console.log(s.charCodeAt(0)); // => 98 ：字元b的Unicode編碼
console.log(s.charCodeAt(5)); // => NaN ：取得一個不存在位置的字符，回傳NaN

4.3 concat(value1,value2 ... valueN) ：連接一個或多個字串,並傳回連接後的字串
參數：

①value1,value2 ... valueN {string} ：一個或多個字串

傳回值：

{string}  傳回連接後的字串

範例：

複製程式碼 程式碼如下:

var s = 'abc';
console.log(s.concat('d')); // => abcd
console.log(s); // => abc ：不影響原先的字串
console.log(s.concat('d', 'e')); // => abcde

4.4 indexOf(value , |startPosition ) ：在實例中從前往後查找一個字串或字符，並返回找到的位置(從0開始計數)。若未找到，返回-1
參數：

①value  {string} ：尋找的字串

②startPosition {int} 可選 ：開始尋找的起始位置，預設從位置0開始尋找

傳回值：

{int}  返回找到的位置(從0開始計數)。若未找到，返回-1

範例：

複製程式碼 程式碼如下:

var s = 'abc';
console.log(s.indexOf('b')); // => 1
console.log(s.indexOf('d')); // => -1 ：找不到
console.log(s.indexOf('b', 2)); // => -1 ：從位置2(第3個字元處)開始找出

4.5 lastIndexOf(value , |startPosition ) ：在實例中從後往前開始查找一個字串或字符，並返回找到的位置(從0開始計數)。若未找到，返回-1
參數：

①value  {string} ：尋找的字串

②startPosition {int} 可選 ：開始尋找的起始位置，預設從最後開始尋找

傳回值：

{int}  返回找到的位置(從0開始計數)。若未找到，返回-1

範例：

複製程式碼 程式碼如下:

var s = 'abcabc';
console.log(s.lastIndexOf('a')); // => 3 ：從後往前找出
console.log(s.lastIndexOf('d')); // => -1 ：未找到回傳-1
console.log(s.lastIndexOf('a', 2)); // => 0 ：從位置2(第3個字元處)開始往前找出

4.6 localeCompare(value) ：實例與參數比較，傳回比較結果
參數：

①value  {string} ：需比較的字串

傳回值：

　　0 ：實例比參數大

　　1 ：實例與參數相等

　 -1 ：實例比參數小

範例：

複製程式碼 程式碼如下:

var s='abc';
console.log(s.localeCompare('ab')); // => 1 ：實例比參數大
console.log(s.localeCompare('abc')); // => 0 ：實例與參數相等
console.log(s.localeCompare('abd')); // => -1 ：實例比參數小

　

4.7 match(regexp) ：使用正規表示式進行匹配查找
參數：

①regexp {regexp} ：正規表示式，eg：/d /

傳回值：

根據正規表示式是否帶屬性'g'，傳回不同的結果；若沒匹配，就回傳 {null}：

①正規表示式不帶屬性'g'，執行一次匹配，返回{單一匹配}結果對象，物件包含以下屬性：

　　數組序號：表示匹配結果，0為匹配文本，1為從做到右第1個圓括號匹配結果，2為第二個圓括號，依此類推

　　index屬性：表示匹配文字在匹配來源的開始位置

　　input屬性：表示匹配來源

②正規表示式帶屬性'g'，執行全域匹配，找到字串所有匹配對象，返回一個{字串數組}：數組元素包含string中的每一個匹配對象，不包含正則表達式括號內的字串，也不提供index和input屬性。

範例：

複製程式碼 程式碼如下:

// 1.單一符合
var s = 'a1b2c3d4';
var mc = s.match(/d /); // => 取得第一個正規匹配的結果
if (mc != null) {
    console.log(mc.index); // => 1 ：匹配結果在匹配來源的起始位置
    console.log(mc.input) // => a1b2c3d4 ：匹配來源
    console.log(mc[0]); // => 1 ：取得符合的結果
}
// 2.全域匹配
var mcArray = s.match(/d /g); // => 取得全部正規匹配的數字
if (mcArray != null) {
    for (var i = 0,len=mcArray.length; i         var mc=mcArray[i];
        console.log(mc); // => 1,2,3,4 ：取得符合的結果
    }
}
// 3.有括號的匹配
s = 'a1b2c3d4';
mc = s.match(/[a-z]([1-9])/); // => 取得第一個正規匹配的結果
if (mc != null) {
    console.log(mc.index); // => 0 ：匹配結果在匹配來源的起始位置
    console.log(mc.input) // => a1b2c3d4 ：匹配來源
    console.log(mc[0]); // => a1 ：序號0表示符合到的結果
    console.log(mc[1]); // => 1 ：序號1表示第一個括號內的子匹配結果
}

4.8  replace(regexp, replaceStr) ：取代正規表示式符合的子字串，並傳回替換後的字串
參數：

①regexp {regexp} ：正規表示式。 eg：/d /

②replaceStr {string | function} ：

1）若是字串，表示替換的字串，符合到字串都替換成此字串；

字串中的$字元有特殊的意義：

$1,$2 ... $99 ：表示①參從左到右圓括號的匹配子項

$& ：表示整個①參匹配的子項

$$ ：美元符號

2）若是函數，表示每個符合結果都會呼叫此函數，函數的唯一參數為符合結果,並傳回一個替換結果。

傳回值：

{string} 傳回一個替換後的字串

範例：

複製程式碼 程式碼如下:

var oldStr = 'a1b2c3d4';
// 1.正規配對到【所有】數字，替換成：','逗號
var newStr = oldStr.replace(/d /g, ',');
console.log(newStr); // => a,b,c,d,
// 2.正規匹配到【所有】數字，替換成：匹配結果 ','逗號
newStr = oldStr.replace(/d /g, '$&,');
console.log(newStr); // => a1,b2,c3,d4,
// 3.正規符合【所有】數字，每個符合結果都會呼叫函數，並傳回替換後的結果
newStr = oldStr.replace(/d /g, function (word) {
    if (word % 2 == 0) {
        return '偶';
    }
    return '奇';
});
console.log(newStr); // => a奇b偶c奇d偶

4.9 search(regexp) ：傳回尋找正規表示式第一個符合的位置
參數：

①regexp {regexp} ：正規表示式。 eg：/d /

傳回值：

{int} 傳回第一個符合的結果的位置；若沒找到符合結果回傳-1

範例：

複製程式碼 程式碼如下:

console.log( 'abcd'.search(/d /) ); // => -1 ：沒有找到數字
console.log( 'abcd1234'.search(/d /) ); // => 4 ：位置序號為4，傳回第一個數字的位置

4.10  slice(start, |end)：傳回從字串start位置到end前一個位置的子字串
參數：

①start {int} ：子字串擷取的起始位置索引(包含此位置的字元)。

　　　　　　若數字為負，表示從字串尾端開始計算。如：-1表示倒數一個字串，-2表示倒數第二個字元。

②end {int} 選用：子字串擷取的結束位置索引(不包含此位置的字元)。

　　　　　　若數字為負，表示從字串尾端開始計算。如：-1表示倒數一個字串，-2表示倒數第二個字元。

　　　　　　若省略此參數，傳回從start位置到結束的所有字元。

注意：

子字串的擷取順序是從左到右有，若start索引位置大於end索引位置，將會傳回一個空字串。

傳回值：

{string} 傳回從字串start位置到end前一個位置的子字串。

範例：

複製程式碼 程式碼如下:

var s = 'abcdefg';
console.log( s.slice(1) ); // bcdefg ：省略end參數，結束位置為結尾
console.log( s.slice(1, 3) ); // bc ：傳回從位置序號1到位置序號2(end前一個位置)的子字串
console.log( s.slice(-3) ); // efg ：傳回從倒數第三個開始到結尾的所有字元
console.log( s.slice(-3, -1) ); // ef ：傳回從倒數第三個開始到第二個(end前一個位置)的所有字元

4.11 split(delimiter, |arrayLength) ：將字串依照某種分隔符號切分成一個由字串組成的陣列並回傳
參數：

①delimiter {regexp | string} ：指定的分隔符，可以為正規表示式或字串。

②arrayLength {int} 可選 ：分割陣列的長度。若省略，則傳回所有分割的子字串。

注意：

若分隔符號在字串的第一個或最後一個，將會新增一個空字串到傳回的陣列。

傳回值：

{ string[] } 傳回一個由字串組成的陣列。

範例：

複製程式碼 程式碼如下:

console.log( 'a,b,c,d,e'.split(',') ); // => ["a", "b", "c", "d", "e"]
console.log( ',a,b,c,d,e,'.split(',') ); // => ["", "a", "b", "c", "d", "e", ""] ：分隔符號在最前面或最後面，會加上一個空字串
console.log( 'a,b,c,d,e'.split(',',3) ); // => ["a", "b", "c"] ：傳回前3個分割的子串
console.log( 'a1b2c3d4e'.split(/d/) ); // => ["a", "b", "c", "d", "e"] ：將數字來做為分隔符號

4.12 substr(start, |wordLength)：傳回從字串start位置開始計算到wordLength個長度的子字串
參數：

①start {int} ：子字串擷取的起始位置索引(包含此位置的字元)。

　　　　　　若數字為負，表示從字串尾端開始計算。如：-1表示倒數一個字串，-2表示倒數第二個字元。

②wordLength {int} 可選 ：擷取字元的長度。若省略此參數，則傳回從start位置到結束的所有字元。

傳回值：

{string} 傳回擷取的字串

範例：

複製程式碼 程式碼如下:

ar s = 'abcdefg';
onsole.log( s.substr(0) ); // =>  abcdefg ：省略第二個參數，回傳從位置序號0開始，一直到最後的字元
onsole.log( s.substr(0, 3) ); // => abc ：傳回從位置序號0開始，計數3個字元
onsole.log( s.substr(2, 4) ); // => cdef ：傳回從位置序號2開始，計數4個字元
onsole.log( s.substr(-2, 3) ); // fg ：傳回從倒數第二個字串開始，計數3個(超過字元長度，就只回傳可統計的字元)

4.13 substring(start, |end) ：傳回從字串start位置到end前一個位置的子字串
參數：

①start {int} ：子字串擷取的起始位置索引(包含此位置的字元)。數字不能為負數，若為負數以0來處理

②end {int} 選用：子字串擷取的結束位置索引(不包含此位置的字元)。數字不能為負數，若為負數以0來處理

傳回值：

{string} 傳回從字串start位置到end前一個位置的子字串。

範例：

複製程式碼 程式碼如下:

var s = 'abcdefg';
console.log( s.substring(0) ); // =>  abcdefg ：省略end參數，回傳從位置序號0開始，一直到最後的字元
console.log( s.substring(0, 3) ); // => abc ：傳回從位置序號0開始到位置序號2(②參的前一個)的字元
console.log( s.substring(2, 4) ); // => cd ：傳回從位置序號2開始到位置序號3(②參的前一個)的字元
console.log( s.substring(-3, 3) ); // abc ：參數若為負，就按數字0來處理，所以此參數實際傳回位置序號0到位置序號3的字元

4.14 toUpperCase() ：將字串轉換為大寫並回傳
4.15 toUpperCase() ：將字串轉換為小寫並回傳
4.16 trim() ：移除字串開頭和結尾處的空白字元並回傳

以上就是本文的全部內容了，希望透過本文，大家對javascript中的String物件能有新的認識。