Javascript學習指南（第2版）筆記(二) 對象、Regex、函數

1、字串基本類型和字串對象的相互轉換
2、String對象
3、Regex
4、數組
5、函數
6、匿名函數
7、函數字面量

1、字串基本類型和字串對象的相互轉換

     如果建立的是字串基本類型，卻又以對象的行為訪問，那麼 JavaScript會將該基本類型自動轉換成對象，但是轉換成的 String對象只是一個臨時變數，並且在屬性操作後銷毀該對象，所以這種操作不夠有效，多了一次轉換的過程而已。

var strName = "Shelley"; //字串基本類型
alert(strName.length);  //隱式建立 String對象，數值與 strName相同，並執行 length方法

2、String對象

本節內容引自：JavaScript String 對象參考手冊
http://www.w3school.com.cn/js/jsref_obj_string.asp

var sObject = new String("Sample string");

     字串是 JavaScript 的一種基本的資料類型。String 對象的 length 屬性聲明了該字串中的字元數。String 類定義了大量操作字串的方法，例如從字串中提取字元或子串，或者檢索字元或子串。

     需要注意的是，JavaScript 的字串是不可變的（immutable），String 類定義的方法都不能改變字串的內容。像 String.toUpperCase() 這樣的方法，返回的是全新的字串，而不是修改原始字串。

     在較早的 Netscape 代碼基的 JavaScript 實現中（例如 Firefox 實現中），字串的行為就像唯讀字元數組。例如，從字串 s 中提取第三個字元，可以用 s[2] 代替更加標準的 s.charAt(2)。此外，對字串應用 for/in 迴圈時，它將枚舉字串中每個字元的數組下標（但要注意，ECMAScript 標準規定，不能枚舉 length 屬性）。因為字串的數組行為不標準，所以應該避免使用它。

 

3、Regex

     Regex是由字串所組成的運算式，用於匹配、替換或者尋找特定的字串。通過 RegExp對象可以顯式地建立Regex：
var searchPatten = new RegExp('s+');

也可以使用文字量方式建立Regex：
var searchPatten = /s+/;

test方法

     test方法將判斷以參數傳入的字串是否與Regex相匹配。

var re = /Javascript rules/i;
/* var re = new RegExp('s+', 'g');    //對象執行個體，第二個參數表示匹配選項 */
var str = "Javascript rules";
if (re.test(str))    document.writeln("I guess it does rule");

其中修飾符
i 執行對大小寫不敏感的匹配。
g 執行全域匹配（尋找所有匹配而非在找到第一個匹配後停止）。
m 執行多行匹配。

exec方法

var re = new RegExp("JS*", "ig");
var str = "cfdsJS *(&YJSjs 888JS";
var resultArray = re.exec(str);
while (resultArray) {
    document.writeln(resultArray[0]);
    document.writeln("next match starts at " + re.lastIndex + "<br />");
    
    resultArray = re.exec(str);
}

/*
由於設定選項 g，RegExp中的 lastIndex屬性會設定為上一次匹配的位置，所以每次 exec調用都會尋找下一個匹配。該樣本中總共找到4次匹配，當沒有匹配時，將會返回的數值是空值 null，當數組為空白值時迴圈自動結束。 

輸出：
JS next match starts at 6
JS next match starts at 13
js next match starts at 15
JS next match starts at 21

*/

exec方法將返回一個數組，但是數組並不是所有匹配項，而是當前匹配項和所有帶圓括弧的子字串。如果在運算式中使用圓括弧引用Regex的某部分，那麼匹配的時候，這些括弧所匹配的字串也會體現在返回的數組中。

var re = /(ds)+(j+s)/ig;
var str = "cfdsJS *(&dsjjjsYJSjs 888dsdsJS";
var resultArray = re.exec(str);
while (resultArray) {
    document.writeln(resultArray[0]);
    document.writeln("next match starts at " + re.lastIndex + "<br />");
    for (var i=1; i<resultArray.length; i++)
    {
        document.writeln("substring of " + resultArray[i] + "<br />");
    }
    document.writeln("<br />")
    
    resultArray = re.exec(str);
}

/*

輸出：
dsJS next match starts at 6
substring of ds
substring of JS

dsjjjs next match starts at 16
substring of ds
substring of jjjs

dsdsJS next match starts at 31
substring of ds
substring of JS

*/

支援Regex的 String 對象的方法
search 檢索與Regex相匹配的值。
match 找到一個或多個Regex的匹配。
replace 替換與Regex匹配的子串。
split 把字串分割為字串數組。
 

參考：JavaScript RegExp 對象參考手冊
http://www.w3school.com.cn/js/jsref_obj_regexp.asp

4、數組

     數組不一定是一維的，在 JavaScript中管理多維陣列的方法是為每個數組元素建立一個新的數組。

var threedPoints = new Array();
threedPoints[0] = new Array(1.2, 3.33, 2.0);
threedPoints[1] = new Array(5.3, 5.5, 5.5);
threedPoints[2] = new Array(6.4, 2.2, 1.9);
var newZPoint = threedPoints[2][2];     //數組以索引方式訪問

     數組的 concat 和 slice都不會改變原有數組，而只是建立一個新的數組以作為方法的傳回值。

     在大多數情況下，數組元素的順序並不重要，不過也有些需要維護數組元素順序的情境，例如隊列。數組維護隊列的方法：
push 將元素添加到數組後面
unshift 將元素添加到數組最前面
pop 移除數組的最後一個元素
shift 移除第一個元素

數組的訪問

//通過迴圈來遍曆數組
for (var i=0; i<threedPoints[0].length; i++){
    alert(threedPoints[0][i]);
}

//使用 forin 迴圈
for (var itemIndex in threedPoints[0]){
    document.writeln(threedPoints[0][itemIndex] + "<br />");
}

根據逗號分隔的字串方式建立數組

var animalString = "cats,dogs,birds,horse";
var animalArray = animalString.split(",");
alert(animalArray[2]);  //alert box display birds

JavaScript Array 對象參考手冊
http://www.w3school.com.cn/js/jsref_obj_array.asp

5、函數 

     JavaScript中函數和對象相似，你可以定義一個函數，建立一個新的函數，甚至輸出一個函數。正是因為有了這個功能，你可以將一個函數給一個變數或數組元素，甚至可以將其作為參數傳給另一個函數調用。

     在 JavaScript中有3種建立函數的方法：聲明式的/靜態、動態/匿名的、字面量式的。在使用它們之前，理解各種方法的效果是十分重要的。

     如果在一個函數中需要執行多個任務，可以考慮將這個函數拆分成幾個更小的單元，這樣做可提高複用性。在實際中，盡量讓函數短小、使其特定於某個人物、盡量保持通用是應該遵守的規則。

 

6、匿名函數

     匿名/動態函數對於定義一個在運行時才能確定需求的函數而言是個很好的方法。匿名函數每次訪問都會解析一次。使用匿名函數構造器：
var variable = new Function("param1", "param2",...,"paramn","function body");

/* 
使用者將通過 alert對話方塊來設定定義函數所需的函數體及兩個參數，
然後調用該函數，
將其產生的結果輸出到頁面上。

註：FF調試通過，IE7異常
*/

//提示輸入函數體和參數
var func = prompt("Enter function body:");
var x = prompt("Enter value of x:");
var y = prompt("Enter value of y:");

//調用這個匿名參數
var op = new Function("x", "y", func);
var theAnswer = op(x, y);       //function anonymous(x, y) {}

//輸出函數執行結果
alert("Function is: ", func);
alert("x is: " + x + 
            "; y is: " + y);
alert("The answer is: " + theAnswer);

/*
輸入/輸出：
Function is: return x * y;
x is : 33; y is : 11;
The answer is: 363;
*/

7、函數字面量

     函數字面量也稱函數運算式，因為這樣建立的函數將成為運算式的一部分，而不是一個特有類型的語句，他們像匿名函數一樣沒有定義函數名稱，但函數字面量只會被解析一次，它是靜態。

     當你想實現如吧一個函數作為另一個函數的參數之類的擴充時，函數字面量的特色就會顯示出來。

//將第三個參數作為函數來聲明
function funcObject(x,y,z){
    alert(z(x,y));
}

//第三個參數是一個函數
funcObject(3, 4, function(x, y){ return x*y})