[Javascript]容易混淆用法-字串物件

[Javascript]容易混淆用法-字串物件

針對字串物件的處理,Javascript有許多容易讓人誤解的地方,以下列舉幾個比較常發生的問題:

1.string.replace( str1, str2 )

類似於C#中的Replace function,就是將str1取代成str2,像以下的例子:

var tString = “This is Test”;
tString.replace(“This”, “this”);

結果是:

image

以上是相同的點,而不同的點在於Javascript的replace只會取代第一個出現的符合字段,比如以上的範例我們改成:

var tString = “This is Test”;
tString.replace(“T”, “t”);

結果是:

image

我們發現只有第一個T被取代成小寫了,第二個T沒有,如果要做到跟C#相同的功能,我們可以透過以下的function來做:

    //自己實作string的replaceStr function  
    String.prototype.replaceStr = function (pBeenReplacedStr,pReplaceStr) {  
    return replaceAllStr(this, pBeenReplacedStr, pReplaceStr)  
    }
  

    //此function遞迴呼叫自己  
    function replaceAllStr(pStr, pBeenReplacedStr, pReplaceStr)  
    {  
        pStr = pStr.replace(pBeenReplacedStr, pReplaceStr);  
        if(pStr.indexOf(pBeenReplacedStr) != -1)  
        {  
            pStr = replaceAllStr(pStr, pBeenReplacedStr, pReplaceStr);  
        }
  
        return pStr;  
    }

使用replaceStr這個function,我們可以做到跟C#相同的功能,

function alertThis(pStr)  
{  
    alert(pStr.replaceStr('T', 't'));  
}

image

2.string.substring跟string.substr的差別

string.substring(startIndex, endIndex):從start index取到end index之間的字串

string.substr(startIndex, length):從start index取得length長度的字串

我們拿以下案例來看一下,很容易看出兩者間的差別:

var str = "Hello World";  
alert(str.substring(4,8));

image

var str = "Hello World";  
alert(str.substr(4,8)); 

image

在寫的過程中又發現另一個有趣的東西,那就是這兩個function跟C#不同,不會出現索引在陣列外的問題,下面兩個寫法:

var str = "Hello World";  
alert(str.substring(4,100));  

var str = "Hello World";  
alert(str.substr(4,100));

得到的結果都是下面這個,不會因為截取不到字段就出錯,

image

3.string.concat、string+、Array.join

我們在做字串組合時,最常用的方法就是string+的方式,而也有人習慣使用string.concat,所以這兩種方法這邊也不多提了,今天主要提Array.join的用法,很多時候我們為了方便後端程式取得變數內容,會將資料以特定的分隔符號組合成字串放到隱藏欄位中,而這邊介紹一個蠻好用的方法:

var tArray = new Array();  
tArray.push("This");  
tArray.push("is");  
tArray.push("Test");  
alert(tArray.join(" "));

透過Array.join的方法,將字串以特定的分隔符號(範例中是空白)做分隔,結果如下:

image

前兩個用法在剛開始撰寫的時候我們可能常犯,不過最好還是搞清楚為上。

游舒帆 (gipi)

探索原力Co-founder,曾任TutorABC協理與鼎新電腦總監,並曾獲選兩屆微軟最有價值專家 ( MVP ),離開職場後創辦探索原力,致力於協助青少年培養面對未來的能力。認為教育與組織育才其實息息相關,都是在為未來儲備能量,2018年起成立為期一年的專題課程《職涯躍升的關鍵24堂課》,為培養台灣未來的領袖而努力。