3-3 摮𦯀葡

JavaScript 的字串資料型態可以用來表示一列文字內容。我們只要把文字括在相符的單括號或雙括號裡，就可以形成一個字串。雙括號可以包含在括在單括號的字串裡，而單括號也可以包含在括在雙括號的字串裡。下列是字串的範例：

"This is a string" 'This is a string quoted by single quotes' "This is a string with 'single' quotes" 'This is a string with "double" quotes' "This another string with \"double\" quotes"

請注意在上述範例中的最後一個字串包含了雙引號，為了避掉雙引號的原來用途（標示字串的開始和結束），我們要在雙引號前加上反斜線（\）。

JavaScript 的字串物件具備了許多方法，這些方法可對字串本身進行各種修改或計算，所造成的效果可列出如下：

Example（string01.htm）：

上述範例的完整原始檔案如下：

原始檔（string01.htm）：（灰色區域按兩下即可拷貝）

<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>字串物件的方法與性質</h2>
<hr>

<script>
myStr = "Tang Poem: 多情卻似總無情，唯覺樽前笑不成。";
document.write("原字串：myStr = " + myStr + "<br>");
document.write("字串長度：myStr.length = " + myStr.length + "<br>");
document.write("增大字型：myStr.big() = " + myStr.big() + "<br>");
document.write("減小字型：myStr.small() = " + myStr.small() + "<br>");
document.write("閃爍字串：myStr.blink() = " + myStr.blink() + "<br>");
document.write("變黑體：myStr.bold() = " + myStr.bold() + "<br>");
document.write("變斜體：myStr.italics() = " + myStr.italics() + "<br>");
document.write("變等寬字體：myStr.fixed() = " + myStr.fixed() + "<br>");
document.write("槓掉字串：myStr.strike() = " + myStr.strike() + "<br>");
document.write("變下標：myStr.sub() = " + myStr.sub() + "<br>");
document.write("變上標：myStr.sup() = " + myStr.sup() + "<br>");
document.write("設定顏色：myStr.fontcolor(\"salmon\") = " + myStr.fontcolor("salmon") + "<br>");
document.write("設定字型大小：myStr.fontsize(5) = " + myStr.fontsize(5) + "<br>");
document.write("換成大寫字母：myStr.toUpperCase() = " + myStr.toUpperCase() + "<br>");
document.write("換成小寫字母：myStr.toLowerCase() = " + myStr.toLowerCase() + "<br>");
document.write("字串並排：myStr.concat(\"新加的\") = " + myStr.concat("新加的") + "<br>");
document.write("抽出字元：myStr.charAt(13) = " + myStr.charAt(13) + "<br>");
document.write("抽出 Unicode 字元：myStr.charCodeAt(13) = " + myStr.charCodeAt(13) + "<br>");
document.write("抽出子字串：myStr.substr(13, 5) = " + myStr.substr(13, 5) + "<br>");
document.write("抽出子字串：myStr.substring(13, 15) = " + myStr.substring(13, 15) + "<br>");
document.write("尋找子字串：myStr.indexOf(\"情\") = " + myStr.indexOf("情") + "<br>");
document.write("尋找子字串：myStr.lastIndexOf(\"情\") = " + myStr.lastIndexOf("情") + "<br>");
</script>

<hr>
</body>
</html>

要注意的是，在執行物件的方法時，輸入引數可有可無，但括號一定要有，此要求和 JavaScript 的函數是一致的。字串物件常用的方法可以列表說明如下：

物件性質或方法說明等效的HTML標籤
String length 傳回字串的長度
big() 增大字串的字型 <big>...</big>
small() 減小字串的字型 ...
blink() 閃爍字串（此方法只適用於 Netscape 瀏覽器，不適用於 IE 瀏覽器） <blink>...</blink>
bold() 變黑體 ...
italics() 變斜體 ...
fixed() 變等寬字體 <tt>...</tt>
strike() 槓掉字串 <strike>...</strike>
sub() 變下標 ...
sup() 變上標 ...
fontcolor() 設定字串的顏色 ...
fontsize() 設定字串的字型大小 ...
toUpperCase() 換成大寫字母

toLowerCase() 換成小寫字母

concat() 字串並排（等效於使用加號）

charAt(n) 抽出第 n 個字元（n=0 代表第一個字元）

charCodeAt(n) 抽出第 n 個字元（n=0 代表第一個字元），並轉換成 Unicode

substr(m, n) 傳回一個字串，從位置 m 開始，且長度為 n

substring(m, n) 傳回一個字串，從位置 m 開始，結束於位置 n-1

indexOf(str) 尋找子字串 str 在原字串的第一次出現位置

lastIndexOf(str) 尋找子字串 str 在原字串的最後一次出現位置

物件	性質或方法	說明	等效的HTML標籤
String	length	傳回字串的長度
big()	增大字串的字型	<big>...</big>
small()	減小字串的字型	<small>...</small>
blink()	閃爍字串（此方法只適用於 Netscape 瀏覽器，不適用於 IE 瀏覽器）	<blink>...</blink>
bold()	變黑體	<b>...</b>
italics()	變斜體	<i>...</i>
fixed()	變等寬字體	<tt>...</tt>
strike()	槓掉字串	<strike>...</strike>
sub()	變下標	<sub>...</sub>
sup()	變上標	<sup>...</sup>
fontcolor()	設定字串的顏色	<font color=...>...</font>
fontsize()	設定字串的字型大小	<font size=...>...</font>
toUpperCase()	換成大寫字母
toLowerCase()	換成小寫字母
concat()	字串並排（等效於使用加號）
charAt(n)	抽出第 n 個字元（n=0 代表第一個字元）
charCodeAt(n)	抽出第 n 個字元（n=0 代表第一個字元），並轉換成 Unicode
substr(m, n)	傳回一個字串，從位置 m 開始，且長度為 n
substring(m, n)	傳回一個字串，從位置 m 開始，結束於位置 n-1
indexOf(str)	尋找子字串 str 在原字串的第一次出現位置
lastIndexOf(str)	尋找子字串 str 在原字串的最後一次出現位置

Hint

請特別注意 substr(m, n) 和 substring(m, n) 在功能上的差異。如果 text = "我願是千萬條江河"，則

text.substr(3,5)會傳回 "千萬條江河"（第3個字元開始，取5個字元）
text.substring(3,5)會傳回 "千萬"（第3個字元開始，第4個字元結束）

在上表中，有關於字串的比對，只提到了 indexOf() 和 lastIndexOf() 兩個方法，事實上 JavaScript 對於字串的比對和代換有許多強大的功能，例如 search、match、replace 等函數，這些功能統稱「通用表示法」，將會在其後章節仔細介紹。

有時候我們也可以將字串看成是 JavaScript 中的指令來執行之，這時候所用到的相關指令是 eval()，此指令特別適用於「使用迴圈創造變數」，請見下列範例：

Example（eval01.htm）：

上述範例的完整原始檔案如下：

原始檔（eval01.htm）：（灰色區域按兩下即可拷貝）

<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>如何使用 eval()</h2>
<hr>

<script>
for (i=1; i<=3; i++){
	command = "x" + i + "=" + i*i*i;
	eval(command);
}
document.write("x1 = " + x1 + "<br>");
document.write("x2 = " + x2 + "<br>");
document.write("x3 = " + x3 + "<br>");
</script>

<hr>
</body>
</html>

在上述範例中，我們把 JavaScript 要執行的命令收集在字串變數 command，然後再用 eval 指令來 "執行" 這個字串，就可以創造出三個變數 x1、x2 和 x3。

JavaScript 還有一些內建或使用者自創的物件，對於這些物件，我們可以使用 toString() 來轉換成字串表示，例如：

Example（toString01.htm）：

上述範例的完整原始檔案如下：

原始檔（toString01.htm）：（灰色區域按兩下即可拷貝）

<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>如何使用 toString()</h2>
<hr>

<script>
x = "This is a string";
document.write("字串：" + x.toString()+"<br>");
x = new Date();
document.write("日期：" + x.toString()+"<br>");
x = ["Mon", "Tue", "Wed"];
document.write("陣列：" + x.toString()+"<br>");
function square(n){
	return(n*n);
}
document.write("函數：" + square.toString()+"<br>");
student = new Object();
student.name = "Timmy";
student.age = "25";
student.phone = "575-1114";
document.write("自訂物件：" + student.toString()+"<br>");
</script>

<hr>
</body>
</html>

由上例可以看出，toString() 的行為視物件型態而定，可列表說明如下：

物件 toString() 的結果
Array（陣列）將 Array 的元素轉換為字串，形成以逗號串連起來的結果，此結果與 Array.toString() 和 Array.join() 得到的結果相同
Boolean（布林）如果布林值為 True，會傳回 "true"；否則會傳回 "false"
Date（日期）傳回顯示日期的文字形式
Error（錯誤）傳回包含錯誤訊息的字串
Function（函數）傳回函數的定義
Number（數字）傳回數字的文字表示法
String（字串）傳回 String 物件的值
自訂物件傳回 "[object Object]"

物件	toString() 的結果
Array（陣列）	將 Array 的元素轉換為字串，形成以逗號串連起來的結果，此結果與 Array.toString() 和 Array.join() 得到的結果相同
Boolean（布林）	如果布林值為 True，會傳回 "true"；否則會傳回 "false"
Date（日期）	傳回顯示日期的文字形式
Error（錯誤）	傳回包含錯誤訊息的字串
Function（函數）	傳回函數的定義
Number（數字）	傳回數字的文字表示法
String（字串）	傳回 String 物件的值
自訂物件	傳回 "[object Object]"

此外，若要將字串轉成數值，可用 parseInt() 或是 parseFloat() 這兩個函數，說明如下：

parseInt() 可將字串轉整數。（若轉換不成功，則傳回 NaN。）
parseFloat() 可將字串轉浮點數。（若轉換不成功，則傳回 NaN。）

相關範例可見前一小節的說明。

JavaScript 程式設計與應用：用於網頁用戶端