JavaScript專題之解讀 v8 排序源碼
JavaScript 專題系列第二十篇，也是最後一篇，解讀 v8 排序源碼javascript
前言
v8 是 Chrome 的 JavaScript 引擎，其中關於數組的排序徹底採用了 JavaScript 實現。html
排序採用的算法跟數組的長度有關，當數組長度小於等於 10 時，採用插入排序，大於 10 的時候，採用快速排序。(固然了，這種說法並不嚴謹)。java
咱們先來看看插入排序和快速排序。git
插入排序
原理
將第一個元素視爲有序序列，遍歷數組，將以後的元素依次插入這個構建的有序序列中。github
圖示
實現
function insertionSort(arr) {
for (var i = 1; i < arr.length; i++) {
var element = arr[i];
for (var j = i - 1; j >= 0; j--) {
var tmp = arr[j];
var order = tmp - element;
if (order > 0) {
arr[j + 1] = tmp;
} else {
break;
}
}
arr[j + 1] = element;
}
return arr;
}
var arr = [6, 5, 4, 3, 2, 1];
console.log(insertionSort(arr));複製代碼
時間複雜度
時間複雜度是指執行算法所須要的計算工做量，它考察當輸入值大小趨近無窮時的狀況，通常狀況下，算法中基本操做重複執行的次數是問題規模 n 的某個函數。算法
最好狀況：數組升序排列，時間複雜度爲：O(n)數組
最壞狀況：數組降序排列，時間複雜度爲：O(n²)瀏覽器
穩定性
穩定性，是指相同的元素在排序後是否還保持相對的位置。函數
要注意的是對於不穩定的排序算法，只要舉出一個實例，便可說明它的不穩定性；而對於穩定的排序算法，必須對算法進行分析從而獲得穩定的特性。性能
好比 [3, 3, 1]，排序後，仍是 [3, 3, 1]，可是實際上是第二個 3 在 第一個 3 前，那這就是不穩定的排序算法。
插入排序是穩定的算法。
優點
當數組是快要排序好的狀態或者問題規模比較小的時候，插入排序效率更高。這也是爲何 v8 會在數組長度小於等於 10 的時候採用插入排序。
快速排序
原理
- 選擇一個元素做爲"基準"
- 小於"基準"的元素，都移到"基準"的左邊；大於"基準"的元素，都移到"基準"的右邊。
- 對"基準"左邊和右邊的兩個子集，不斷重複第一步和第二步，直到全部子集只剩下一個元素爲止。
示例
示例和下面的實現方式來源於阮一峯老師的《快速排序（Quicksort）的Javascript實現》
以數組 [85, 24, 63, 45, 17, 31, 96, 50] 爲例：
第一步，選擇中間的元素 45 做爲"基準"。（基準值能夠任意選擇，可是選擇中間的值比較容易理解。）
第二步，按照順序，將每一個元素與"基準"進行比較，造成兩個子集，一個"小於45"，另外一個"大於等於45"。
第三步，對兩個子集不斷重複第一步和第二步，直到全部子集只剩下一個元素爲止。
實現
var quickSort = function(arr) {
if (arr.length <= 1) { return arr; }
// 取數組的中間元素做爲基準
var pivotIndex = Math.floor(arr.length / 2);
var pivot = arr.splice(pivotIndex, 1)[0];
var left = [];
var right = [];
for (var i = 0; i < arr.length; i++){
if (arr[i] < pivot) {
left.push(arr[i]);
} else {
right.push(arr[i]);
}
}
return quickSort(left).concat([pivot], quickSort(right));
};複製代碼
然而這種實現方式須要額外的空間用來儲存左右子集，因此還有一種原地(in-place)排序的實現方式。
圖示
咱們來看看原地排序的實現圖示：
爲了讓你們看明白快速排序的原理，我調慢了執行速度。
在這張示意圖裏，基準的取值規則是取最左邊的元素，黃色表明當前的基準，綠色表明小於基準的元素，紫色表明大於基準的元素。
咱們會發現，綠色的元素會緊挨在基準的右邊，紫色的元素會被移到後面，而後交換基準和綠色的最後一個元素，此時，基準處於正確的位置，即前面的元素都小於基準值，後面的元素都大於基準值。而後再對前面的和後面的多個元素取基準，作排序。
in-place 實現
function quickSort(arr) {
// 交換元素
function swap(arr, a, b) {
var temp = arr[a];
arr[a] = arr[b];
arr[b] = temp;
}
function partition(arr, left, right) {
var pivot = arr[left];
var storeIndex = left;
for (var i = left + 1; i <= right; i++) {
if (arr[i] < pivot) {
swap(arr, ++storeIndex, i);
}
}
swap(arr, left, storeIndex);
return storeIndex;
}
function sort(arr, left, right) {
if (left < right) {
var storeIndex = partition(arr, left, right);
sort(arr, left, storeIndex - 1);
sort(arr, storeIndex + 1, right);
}
}
sort(arr, 0, arr.length - 1);
return arr;
}
console.log(quickSort(6, 7, 3, 4, 1, 5, 9, 2, 8))複製代碼
穩定性
快速排序是不穩定的排序。若是要證實一個排序是不穩定的，你只用舉出一個實例就行。
因此咱們舉一個唄~
就以數組 [1, 2, 3, 3, 4, 5] 爲例，由於基準的選擇不肯定，假如選定了第三個元素(也就是第一個 3) 爲基準，全部小於 3 的元素在前面，大於等於 3 的在後面，排序的結果沒有問題。但是若是選擇了第四個元素(也就是第二個 3 )，小於 3 的在基準前面，大於等於 3 的在基準後面，第一個 3 就會被移動到 第二個 3 後面，因此快速排序是不穩定的排序。
時間複雜度
阮一峯老師的實現中，基準取的是中間元素，而原地排序中基準取最左邊的元素。快速排序的關鍵點就在於基準的選擇，選取不一樣的基準時，會有不一樣性能表現。
快速排序的時間複雜度最好爲 O(nlogn)，但是爲何是 nlogn 呢？來一個並不嚴謹的證實：
在最佳狀況下，每一次都平分整個數組。假設數組有 n 個元素，其遞歸的深度就爲 log2n + 1，時間複雜度爲 O(n)[(log2n + 1)]，由於時間複雜度考察當輸入值大小趨近無窮時的狀況，因此會忽略低階項，時間複雜度爲：o(nlog2n)。
若是一個程序的運行時間是對數級的，則隨着 n 的增大程序會漸漸慢下來。若是底數是 10，lg1000 等於 3，若是 n 爲 1000000，lgn 等於 6，僅爲以前的兩倍。若是底數爲 2，log21000 的值約爲 10，log21000000 的值約爲 19，約爲以前的兩倍。咱們能夠發現任意底數的一個對數函數其實都相差一個常數倍而已。因此咱們認爲 O(logn)已經能夠表達全部底數的對數了，因此時間複雜度最後爲： O(nlogn)。
而在最差狀況下，若是對一個已經排序好的數組，每次選擇基準元素時老是選擇第一個元素或者最後一個元素，那麼每次都會有一個子集是空的，遞歸的層數將達到 n，最後致使算法的時間複雜度退化爲 O(n²)。
這也充分說明了一個基準的選擇是多麼的重要，而 v8 爲了提升性能，就對基準的選擇作了不少優化。
v8 基準選擇
v8 選擇基準的原理是從頭和尾以外再選擇一個元素，而後三個值排序取中間值。
當數組長度大於 10 可是小於 1000 的時候，取中間位置的元素，實現代碼爲：
// 基準的下標
// >> 1 至關於除以 2 (忽略餘數)
third_index = from + ((to - from) >> 1);複製代碼
當數組長度大於 1000 的時候，每隔 200 ~ 215 個元素取一個值，而後將這些值進行排序，取中間值的下標，實現的代碼爲：
// 簡單處理過
function GetThirdIndex(a, from, to) {
var t_array = new Array();
// & 位運算符
var increment = 200 + ((to - from) & 15);
var j = 0;
from += 1;
to -= 1;
for (var i = from; i < to; i += increment) {
t_array[j] = [i, a[i]];
j++;
}
// 對隨機挑選的這些值進行排序
t_array.sort(function(a, b) {
return comparefn(a[1], b[1]);
});
// 取中間值的下標
var third_index = t_array[t_array.length >> 1][0];
return third_index;
}複製代碼
也許你會好奇 200 + ((to - from) & 15) 是什麼意思？
& 表示是按位與，對整數操做數逐位執行布爾與操做。只有兩個操做數中相對應的位都是 1，結果中的這一位纔是 1。
以 15 & 127 爲例：
15 二進制爲： （0000 1111）
127 二進制爲：（1111 1111）
按位與結果爲：（0000 1111）＝ 15
因此 15 & 127 的結果爲 15。
注意 15 的二進制爲： 1111，這就意味着任何和 15 按位與的結果都會小於或者等於 15，這才實現了每隔 200 ~ 215 個元素取一個值。
v8 源碼
終於到了看源碼的時刻！源碼地址爲：github.com/v8/v8/blob/…。
function InsertionSort(a, from, to) {
for (var i = from + 1; i < to; i++) {
var element = a[i];
for (var j = i - 1; j >= from; j--) {
var tmp = a[j];
var order = comparefn(tmp, element);
if (order > 0) {
a[j + 1] = tmp;
} else {
break;
}
}
a[j + 1] = element;
}
};
function QuickSort(a, from, to) {
var third_index = 0;
while (true) {
// Insertion sort is faster for short arrays.
if (to - from <= 10) {
InsertionSort(a, from, to);
return;
}
if (to - from > 1000) {
third_index = GetThirdIndex(a, from, to);
} else {
third_index = from + ((to - from) >> 1);
}
// Find a pivot as the median of first, last and middle element.
var v0 = a[from];
var v1 = a[to - 1];
var v2 = a[third_index];
var c01 = comparefn(v0, v1);
if (c01 > 0) {
// v1 < v0, so swap them.
var tmp = v0;
v0 = v1;
v1 = tmp;
} // v0 <= v1.
var c02 = comparefn(v0, v2);
if (c02 >= 0) {
// v2 <= v0 <= v1.
var tmp = v0;
v0 = v2;
v2 = v1;
v1 = tmp;
} else {
// v0 <= v1 && v0 < v2
var c12 = comparefn(v1, v2);
if (c12 > 0) {
// v0 <= v2 < v1
var tmp = v1;
v1 = v2;
v2 = tmp;
}
}
// v0 <= v1 <= v2
a[from] = v0;
a[to - 1] = v2;
var pivot = v1;
var low_end = from + 1; // Upper bound of elements lower than pivot.
var high_start = to - 1; // Lower bound of elements greater than pivot.
a[third_index] = a[low_end];
a[low_end] = pivot;
// From low_end to i are elements equal to pivot.
// From i to high_start are elements that haven't been compared yet.
partition: for (var i = low_end + 1; i < high_start; i++) {
var element = a[i];
var order = comparefn(element, pivot);
if (order < 0) {
a[i] = a[low_end];
a[low_end] = element;
low_end++;
} else if (order > 0) {
do {
high_start--;
if (high_start == i) break partition;
var top_elem = a[high_start];
order = comparefn(top_elem, pivot);
} while (order > 0);
a[i] = a[high_start];
a[high_start] = element;
if (order < 0) {
element = a[i];
a[i] = a[low_end];
a[low_end] = element;
low_end++;
}
}
}
if (to - high_start < low_end - from) {
QuickSort(a, high_start, to);
to = low_end;
} else {
QuickSort(a, from, low_end);
from = high_start;
}
}
}
var arr = [10, 9, 8, 7, 6, 5, 4, 3, 2, 1, 0];
function comparefn(a, b) {
return a - b
}
QuickSort(arr, 0, arr.length)
console.log(arr)複製代碼
咱們以數組 [10, 9, 8, 7, 6, 5, 4, 3, 2, 1, 0] 爲例，分析執行的過程。
1.執行 QuickSort 函數 參數 from 值爲 0，參數 to 的值 11。
2.10 < to - from < 1000 第三個基準元素的下標爲 (0 + 11 >> 1) = 5，基準值 a[5] 爲 5。
3.比較 a[0] a[10] a[5] 的值，而後根據比較結果修改數組，數組此時爲 [0, 9, 8, 7, 6, 5, 4, 3, 2, 1, 10]
4.將基準值和數組的第(from + 1)個即數組的第二個元素互換，此時數組爲 [0, 5, 8, 7, 6, 9, 4, 3, 2, 1, 10]，此時在基準值 5 前面的元素確定是小於 5 的，由於第三步已經作了一次比較。後面的元素是未排序的。
咱們接下來要作的就是把後面的元素中小於 5 的所有移到 5 的前面。
5.而後咱們進入 partition 循環，咱們依然以這個數組爲例，單獨抽出來寫個 demo 講一講
// 假設代碼執行到這裏，爲了方便演示，咱們直接設置 low_end 等變量的值
// 能夠直接複製到瀏覽器中查看數組變換效果
var a = [0, 5, 8, 7, 6, 9, 4, 3, 2, 1, 10]
var low_end = 1;
var high_start = 10;
var pivot = 5;
console.log('起始數組爲', a)
partition: for (var i = low_end + 1; i < high_start; i++) {
var element = a[i];
console.log('循環當前的元素爲：', a[i])
var order = element - pivot;
if (order < 0) {
a[i] = a[low_end];
a[low_end] = element;
low_end++;
console.log(a)
}
else if (order > 0) {
do {
high_start--;
if (high_start == i) break partition;
var top_elem = a[high_start];
order = top_elem - pivot;
} while (order > 0);
a[i] = a[high_start];
a[high_start] = element;
console.log(a)
if (order < 0) {
element = a[i];
a[i] = a[low_end];
a[low_end] = element;
low_end++;
}
console.log(a)
}
}
console.log('最後的結果爲', a)
console.log(low_end)
console.log(high_start)複製代碼
6.此時數組爲 [0, 5, 8, 7, 6, 9, 4, 3, 2, 1, 10]，循環從第三個元素開始，a[i] 的值爲 8，由於大於基準值 5，即 order > 0，開始執行 do while 循環，do while 循環的目的在於倒序查找元素，找到第一個小於基準值的元素，而後讓這個元素跟 a[i] 的位置交換。
第一個小於基準值的元素爲 1，而後 1 與 8 交換，數組變成 [0, 5, 1, 7, 6, 9, 4, 3, 2, 8, 10]。high_start 的值是爲了記錄倒序查找到哪裏了。
7.此時 a[i] 的值變成了 1，而後讓 1 跟 基準值 5 交換，數組變成了 [0, 1, 5, 7, 6, 9, 4, 3, 2, 8, 10]，low_end 的值加 1，low_end 的值是爲了記錄基準值的所在位置。
8.循環接着執行，遍歷第四個元素 7，跟第 六、7 的步驟一致，數組先變成 [0, 1, 5, 2, 6, 9, 4, 3, 7, 8, 10]，再變成 [0, 1, 2, 5, 6, 9, 4, 3, 7, 8, 10]
9.遍歷第五個元素 6，跟第 六、7 的步驟一致，數組先變成 [0, 1, 2, 5, 3, 9, 4, 6, 7, 8, 10]，再變成 [0, 1, 2, 3, 5, 9, 4, 6, 7, 8, 10]
10.遍歷第六個元素 9，跟第 六、7 的步驟一致，數組先變成 [0, 1, 2, 3, 5, 4, 9, 6, 7, 8, 10]，再變成 [0, 1, 2, 3, 4, 5, 9, 6, 7, 8, 10]
11.在下一次遍歷中，由於 i == high_start，意味着正序和倒序的查找終於找到一塊兒了，後面的元素確定都是大於基準值的，此時退出循環
12.遍歷後的結果爲 [0, 1, 2, 3, 4, 5, 9, 6, 7, 8, 10]，在基準值 5 前面的元素都小於 5，後面的元素都大於 5，而後咱們分別對兩個子集進行 QuickSort
13.此時 low_end 值爲 5，high_start 值爲 6，to 的值依然是 10，from 的值依然是 0，to - high_start < low_end - from 的結果爲 true，咱們對 QuickSort(a, 6, 10)，即對後面的元素進行排序，可是注意，在新的 QuickSort 中，由於 from - to 的值小於 10，因此這一次實際上是採用了插入排序。因此準確的說，當數組長度大於 10 的時候，v8 採用了快速排序和插入排序的混合排序方法。
14.而後 to = low_end 即設置 to 爲 5，由於 while(true) 的緣由，會再執行一遍，to - from 的值爲 5，執行 InsertionSort(a, 0, 5)，即對基準值前面的元素執行一次插入排序。
15.由於在 to - from <= 10 的判斷中，有 return 語句，因此 while 循環結束。
16.v8 在對數組進行了一次快速排序後，而後對兩個子集分別進行了插入排序，最終修改數組爲正確排序後的數組。
比較
最後來張示意圖感覺下插入排序和快速排序：
圖片來自於 www.toptal.com/developers/…
專題系列
JavaScript專題系列目錄地址：github.com/mqyqingfeng…。
JavaScript專題系列預計寫二十篇左右，主要研究平常開發中一些功能點的實現，好比防抖、節流、去重、類型判斷、拷貝、最值、扁平、柯里、遞歸、亂序、排序等，特色是研(chao)究(xi) underscore 和 jQuery 的實現方式。
若是有錯誤或者不嚴謹的地方，請務必給予指正，十分感謝。若是喜歡或者有所啓發，歡迎 star，對做者也是一種鼓勵。
- 1. JavaScript專題之解讀 v8 排序源碼
- 2. 解讀 v8 排序源碼
- 3. JavaScript專題之亂序
- 4. 排序專題之冒泡排序
- 5. chromium源碼閱讀--V8 Embbeding
- 6. 從 V8 源碼看 JS 數組排序的詭異問題
- 7. 排序專題
- 8. JavaScript > Juicer.js源碼解讀
- 9. v8源碼解析之hashmap(基於0.1.5)
- 10. 科普 | 編譯 V8 源碼
- 更多相關文章...
- • ADO 排序 - ADO 教程
- • PHP 數組排序 - PHP教程
- • 算法總結-歸併排序
- • JDK13 GA發佈：5大特性解讀
-
每一个你不满意的现在，都有一个你没有努力的曾经。