好家伙， 

在上一篇中,我們知道了,

JS的陣列中每個槽位可以存盤任意型別的資料

那么,我們能通過陣列去模仿某些資料結構嗎?

答案是肯定的

1.堆疊方法

ECMAScript 給陣列提供幾個方法，讓它看起來像是另外一種資料結構，

陣列物件可以像堆疊一樣，也就是一種限制插人和洗掉項的資料結構，

堆疊是一種后進先出（LIFO，Last-In-First-Out）的結構，也就是最近添加的項先被洗掉，

資料項的插入（稱為推入，push）和洗掉（稱為彈出，pop）只在堆疊的一個地方發生，即堆疊頂，

ECMAScript陣列提供了push（）和pop（）方法，以實作類似堆疊的行為，
push（）方法接收任意數量的引數，并將它們添加到陣列末尾，回傳陣列的最新長度，

pop（）方法則用于洗掉陣列的最后一項，同時減少陣列的1ength值，回傳被洗掉的項，

用法示例:

let colors = ["red", "blue", "green"]; //定義一個字串陣列
let cpush = colors.push("black");
console.log(colors,cpush);

let cpop = colors.pop();
console.log(colors,cpop);

 (這張圖,沒有十年畫工畫不出來)

2.佇列方法

2.1.正佇列

就像堆疊是以LIFO形式限制訪問的資料結構一樣，佇列以先進先出（FIFO，First-In-First-Out）形式限制訪問，

佇列在串列末尾添加資料，但從串列開頭獲取資料，

因為有了在資料末尾添加資料的push（）方法，所以要模擬佇列就差一個從陣列開頭取得資料的方法了，

這個陣列方法叫shift（），它會洗掉陣列的第一項并回傳它，然后陣列長度減1，

使用shift（）和push（），可以把陣列當成佇列來使用

用法示例:

let colors = ["red", "blue", "green"]; //定義一個字串陣列
let cpush = colors.push("black");
console.log(colors,cpush);

let cshift = colors.shift();
console.log(colors,cshift);
console.log(colors,colors.shift());

2.2.逆佇列

ECMAScript也為陣列提供了unshift()方法，

顧名思義，unshift（）就是執行跟shift（）相反的操作：在陣列開頭添加任意多個值，然后回傳新的陣列長度，

通過使用 unshift（）和pop（），可以在相反方向上模擬佇列，即在陣列開頭添加新資料，在陣列末尾取得資料， 

用法示例:

let colors = ["red", "blue", "green"]; //定義一個字串陣列
let cunshift = colors.unshift("black");
console.log(colors,cunshift);

let cpop = colors.pop();//將出隊元素重新插回隊頭
colors.unshift(cpop);

console.log(colors,cpop);
console.log(colors,colors.pop());

 (這張圖,沒有十年畫工畫不出來)

3.排序方法

 陣列有兩個方法可以用來對元素重新排序：reverse（）和sort()，

3.1.reverse()反轉陣列方法

顧名思義，reverse（）方法就是將陣列元素反向排列，

用法示例:

let colors = ["red", "blue", "green"]; //定義一個字串陣列
colors.reverse();
console.log(colors);

 (貌似一些基礎面試題會有類似的題目,叫你去反轉某個陣列,這么干就對了)

3.2.sort()排序方法

按照官方的說法,這是一個排序方法,

默認情況下，sort（）會按照升序重新排列陣列元素，即最小的值在前面，最大的值在后面，

為此，sort（）會在每一項上呼叫string（）轉型函式，然后比較字串來決定順序，

但他并不總是能得到正確的排序

let colors = [99999,99,999,9999,9]; 
colors.sort();
console.log(colors);

colors_1 =[9, 99, 999, 9999, 99999];
colors_1.sort();
console.log(colors_1);

colors_2 =[0,1,5,10,15];
colors_2.sort();
console.log(colors_2);

 這里我們可以看到,第三個例子的排序錯誤了

為此，sort（）方法可以接收一個比較函式，用于判斷哪個值應該排在前面.

比較函式接收兩個引數，

(1) 如果第一個引數應該排在第二個引數前面，就回傳負值；

(2) 如果兩個引數相等，就回傳0；

(3) 如果第一個引數應該排在第二個引數后面，就回傳正值，

function compare_1(valuel, value2){
    if (valuel < value2){
        return -1;
    }
    else if (valuel > value2) {
        return 1;
    }
    else{
        return 0;
    }
}

回傳-1就不進行交換,回傳1將對兩個值對調

colors_2 = [0, 1, 5, 10, 15];

//從小到大排序
function compare_1(valuel, value2){
    if (valuel < value2){
        return -1;
    }
    else if (valuel > value2) {
        return 1;
    }
    else{
        return 0;
    }
}

//從大到小排序
function compare_2(valuel, value2){
    if (valuel < value2){
        return 1;
    }
    else if (valuel > value2) {
        return -1;
    }
    else{
        return 0;
    }
}

console.log(colors_2.sort(compare_1));
console.log(colors_2.sort(compare_2));

如果陣列的元素是數值，或者是其valueOf（）方法回傳數值的物件（如Date物件），這個比較函式還可以寫得更簡單，

更簡便的寫法:

colors_2 = [0, 1, 5, 10, 15];
function compare_3(value1, value2){
    return value2-value1;
}

function compare_4(value1, value2){
    return value1-value2;
}
console.log(colors_2.sort(compare_3));
console.log(colors_2.sort(compare_4));

怎么說呢,感覺這個sort()設計的并不是很好,用起來并不是那么的方便,

要排序的話,或許直接寫一個冒泡排序或者快速排序可以解決?

又或者是開發者故意開放一個比較函式來讓我們編輯的?

JS-陣列sort方法用的是哪種排序演算法 - 簡書 (jianshu.com)

等有了更多知識儲備再來回答吧

標籤：JavaScript

上一篇：現代 CSS 高階技巧，完美的波浪進度條效果！

下一篇：我們是否對現代前端開發框架過于崇拜了？