第五章 引用類型

在上一章中，作者就在說變量的值的時候，提到過引用類型這個概念。JavaScript中存在基本類型和引用類型，其中引用類型很重要，這裏有許多我們需要註意的東西。從目錄中，可以看到JavaScript中的引用類型有：Object類型、Array類型、Data類型、RegExp類型、Function類型、基本內置類型、單體內置類型。下面我將整理這裏的知識點。

①引用類型是一種數據結構，用於將數據和功能組織在一起，它也被稱為類，但JavaScript中卻不支持類和接口都基本機構，故稱之為對象定義。

②Object是使用最多的一個類型。創建Object有兩種方法。

第一種使用new操作符：

1 var person = new Object();
2 person.name = "xuchaoi";
3 person.age = 24;

第二種使用對象字面量表示法：

1 var person = {
2     name: "xuchaoi",
3     age: "24"
4 }  // 訪問對象的值：person.name

③創建Array和創建Object類似。可以通過new操作符或數組字面量表示法創建

④通過Array.isArray()方法來檢測數組。因為typeof()檢測數組、對象或Null類型返回的都是“object”

⑤拆分數組成字符串方法：join()

1 var name = ["小明", "小紅", "小青"];
2 consol.log(name.join("&"));  // 小明&小紅&小青

⑥數組模擬數據結構棧。push()向數組末尾添加值，pop()移除數組末尾項。從而實現後進先出的棧結構

⑦數組模擬數據結構對。push()向數組末尾添加值，shift()移除數組首項。從而實現先進先出的對結構

⑧unshift()與shift()相反,它向數組首項添加值

⑨數組倒序方法：reverse()。該方法會反轉數組項的順序。

⑩數組排序方法：sort()。默認情況下，它會先為數組每項進行toString()轉型，然後按照升序排列數組項

1 var values = [0, 1, 5, 10, 15];
2 console.log(value.sort());    //0,1,10,15,5

這樣的結果顯然不是我們想要的，這裏sort()方法接受一個比較函數作為參數，以便我們控制順序。比較函數有兩個參數，分別是前一個值和後一個值。如果第一個值放在第二個值後面則返回一個正數，反之返回一個負數，無論先後返回0。

function compare(value, nextValue) {
    if(value < nextValue) {
        return -1;
    } else if(value > nextValue) {
        return 1;
    } else{
        return 0;
    }
}
var values = [1, 0, 10, 5, 15];
console.log(values.sort(compare));    //0,1,5,10,15

?連接數組：concat()，接受參數：字符串、數組

?截取數組（不對原數組進行改變生成新數組）方法：slice()。接收連個參數：起始值，結束值（可省略）。

1 var colors = ["紅色", "黃色", "綠色", "藍色"];
2 var colors1 = colors.slice(1);    //截取從起始值到結束(數值都是從0計數)
3 var colors2 = colors.slice(1,3)  //截取從起始值到結束值（不包括結束值）
4 console.log(colors1);        //["黃色", "綠色", "藍色"]  
5 console.log(colors2);        //["黃色", "綠色"]

?操作數組的方法：splice()。該方法可以刪除數組的項，向數組中插入項，給數組替換項（即在刪除數組項的同時再在相應位置添加項）

?數組項的位置方法：indexOf()。從數組第一項向後查我們設置的值，一旦查到就返回該值在數組中的位置索引，沒有查到返回-1。利用這點可以對數組進行查重

1 //原理說明：利用indexOf只會返回數組中元素首次出現的位置與filter內函數index值的不等進行篩選
2 var arry = [1,2,3,4,1,2,3];
3 var newArray = arry.filter(function(element,index,self) {
4     return self.indexOf(element) === index;
5 });    //說明：filter()會遍歷數組，過濾數組不符合要求的元素
6 console.log(newArray);    //[1,2,3,4]

?數組遍歷map()。

1 var numbers = [1, 2, 3, 4, 5];
2 var numbers2 = numbers.map(function(item, index, array){
3     return item * 2;
4 });
5 console.log(numbers2);    // [2,4,6,8,10]

?數組遍歷forEach()

1 var numbers = [1, 2, 3, 4, 5];
2 numbers.forEach(function(item, index, array){
3     array[index] = item * 2;
4 });
5 console.log(numbers);    // [2,4,6,8,10]

?數組累積叠代方法reduce()

1 var numbers = [1, 2, 3, 4, 5];
2 var sum = numbers.reduce(function(prev, cur, index, array) {
3     return prev + cur;
4 });    //reduce叠代函數接受4個參數：前一個值，當前值，項的索引，數組對象
5 console.log(sum); //15

這裏先說到數組，下節將繼續講述引用類型章節的註意要點！

《javascript高級程序設計》筆記五（轉載）