JavaScript排序算法详解-CSDN博客

阿里云国内75折 回扣 微信号:monov8
阿里云国际,腾讯云国际,低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号:monov8 飞机:@monov6

JavaScript排序算法详解

目录

JavaScript排序算法详解

JS家的排序算法

引子

十大经典算法排序总结对比

名词解释

冒泡排序Bubble Sort

冒泡排序须知

什么时候最快Best Cases

什么时候最慢Worst Cases

冒泡排序动图演示

冒泡排序JavaScript代码实现

选择排序Selection Sort

选择排序须知

选择排序动图演示

选择排序JavaScript代码实现

插入排序Insertion Sort

插入排序须知

插入排序动图演示

插入排序JavaScript代码实现

希尔排序Shell Sort

希尔排序须知

希尔排序JavaScript代码实现

归并排序Merge Sort

归并排序须知

归并排序动图演示

归并排序JavaScript代码实现

快速排序Quick Sort

快速排序须知

快速排序动图演示

快速排序JavaScript代码实现

堆排序Heap Sort

堆排序须知

堆排序动图演示

堆排序JavaScript代码实现

计数排序Counting Sort

计数排序须知

计数排序动图演示

计数排序JavaScript代码实现

桶排序Bucket Sort

桶排序须知

什么时候最快Best Cases

什么时候最慢Worst Cases

桶排序JavaScript代码实现

基数排序Radix Sort

基数排序须知

基数排序 vs 计数排序 vs 桶排序

LSD基数排序动图演示

基数排序JavaScript代码实现

写在最后


 

 

 

本文章向大家介绍JavaScript排序算法详解主要内容包括JS家的排序算法、十大经典算法排序总结对比、冒泡排序Bubble Sort、选择排序Selection Sort、插入排序Insertion Sort、希尔排序Shell Sort、归并排序Merge Sort、快速排序Quick Sort、堆排序Heap Sort、计数排序Counting Sort、桶排序Bucket Sort、基数排序Radix Sort、写在最后、基本概念、基础应用、原理机制和需要注意的事项等并结合实例形式分析了其使用技巧希望通过本文能帮助到大家理解应用这部分内容。

 

 

 

JS家的排序算法

引子

有句话怎么说来着

雷锋推倒雷峰塔Java implements JavaScript.

当年想凭借抱Java大腿火一把而不惜把自己名字给改了的JavaScript原名LiveScript如今早已光芒万丈。node JS的出现更是让JavaScript可以前后端通吃。虽然Java依然制霸企业级软件开发领域C/C + +的大神们不要打我。。。但在Web的江湖JavaScript可谓风头无两坐上了头把交椅。

然而在传统的计算机算法和数据结构领域大多数专业教材和书籍的默认语言都是Java或者C/C+ +。这给最近想恶补算法和数据结构知识的我造成了一定困扰因为我想寻找一本以JavaScript为默认语言的算法书籍。当我了解到O’REILLY家的动物丛书系列里有一本叫做《数据结构与算法JavaScript描述》时便兴奋的花了两天时间把这本书从头到尾读了一遍。它是一本很好的针对前端开发者们的入门算法书籍可是它有一个很大的缺陷就是里面有很多明显的小错误明显到就连我这种半路出家的程序猿都能一眼看出来。还有一个问题是很多重要的算法和数据结构知识并没有在这本书里被提到。这些问题对于作为一个晚期强迫症患者的我来说简直不能忍。于是乎一言不合我就决定自己找资料总结算法。那么我就从算法领域里最基础的知识点——排序算法总结起好了。

 

我相信以下的代码里一定会有某些bug或错误或语法不规范等问题是我自己无法发现的所以敬请各位大神能够指出错误因为只有在不断改错的道路上我才能取得长久的进步。

十大经典算法排序总结对比

 

主流排序算法概览

名词解释

n: 数据规模 k:“桶”的个数 In-place: 占用常数内存不占用额外内存 Out-place: 占用额外内存 稳定性排序后2个相等键值的顺序和排序之前它们的顺序相同

冒泡排序Bubble Sort

冒泡排序须知

作为最简单的排序算法之一冒泡排序给我的感觉就像Abandon在单词书里出现的感觉一样每次都在第一页第一位所以最熟悉。。。冒泡排序还有一种优化算法就是立一个flag当在一趟序列遍历中元素没有发生交换则证明该序列已经有序。但这种改进对于提升性能来说并没有什么太大作用。。。

什么时候最快Best Cases

当输入的数据已经是正序时都已经是正序了我还要你冒泡排序有何用啊。。。。

什么时候最慢Worst Cases

当输入的数据是反序时写一个for循环反序输出数据不就行了干嘛要用你冒泡排序呢我是闲的吗。。。

Bubble Sort 动图演示 算法可视化来源http://visualgo.net/

冒泡排序JavaScript代码实现

function bubbleSort(arr) {
    var len = arr.length;
    for (var i = 0; i < len; i++) {
        for (var j = 0; j < len - 1 - i; j++) {
            if (arr[j] > arr[j+1]) {        //相邻元素两两对比
                var temp = arr[j+1];        //元素交换
                arr[j+1] = arr[j];
                arr[j] = temp;
            }
        }
    }
    return arr;
}

选择排序Selection Sort

选择排序须知

在时间复杂度上表现最稳定的排序算法之一因为无论什么数据进去都是O(n²)的时间复杂度。。。所以用到它的时候数据规模越小越好。唯一的好处可能就是不占用额外的内存空间了吧。

选择排序动图演示

Selection Sort 动图演示 算法可视化来源http://visualgo.net/

选择排序JavaScript代码实现

function selectionSort(arr) {
    var len = arr.length;
    var minIndex, temp;
    for (var i = 0; i < len - 1; i++) {
        minIndex = i;
        for (var j = i + 1; j < len; j++) {
            if (arr[j] < arr[minIndex]) {     //寻找最小的数
                minIndex = j;                 //将最小数的索引保存
            }
        }
        temp = arr[i];
        arr[i] = arr[minIndex];
        arr[minIndex] = temp;
    }
    return arr;
}

插入排序Insertion Sort

插入排序须知

插入排序的代码实现虽然没有冒泡排序和选择排序那么简单粗暴但它的原理应该是最容易理解的了因为只要打过扑克牌的人都应该能够秒懂。当然如果你说你打扑克牌摸牌的时候从来不按牌的大小整理牌那估计这辈子你对插入排序的算法都不会产生任何兴趣了。。。 插入排序和冒泡排序一样也有一种优化算法叫做拆半插入。对于这种算法得了懒癌的我就套用教科书上的一句经典的话吧感兴趣的同学可以在课后自行研究。。。

插入排序动图演示

Insertion Sort 动图演示 算法可视化来源http://visualgo.net/

插入排序JavaScript代码实现

function insertionSort(arr) {
    var len = arr.length;
    var preIndex, current;
    for (var i = 1; i < len; i++) {
        preIndex = i - 1;
        current = arr[i];
        while(preIndex >= 0 && arr[preIndex] > current) {
            arr[preIndex+1] = arr[preIndex];
            preIndex--;
        }
        arr[preIndex+1] = current;
    }
    return arr;
}

希尔排序Shell Sort

希尔排序须知

希尔排序是插入排序的一种更高效率的实现。它与插入排序的不同之处在于它会优先比较距离较远的元素。希尔排序的核心在于间隔序列的设定。既可以提前设定好间隔序列也可以动态的定义间隔序列。动态定义间隔序列的算法是《算法第4版》的合著者Robert Sedgewick提出的。在这里我就使用了这种方法。

希尔排序JavaScript代码实现

function shellSort(arr) {
    var len = arr.length,
        temp,
        gap = 1;
    while(gap < len/3) {          //动态定义间隔序列
        gap =gap*3+1;
    }
    for (gap; gap > 0; gap = Math.floor(gap/3)) {
        for (var i = gap; i < len; i++) {
            temp = arr[i];
            for (var j = i-gap; j >= 0 && arr[j] > temp; j-=gap) {
                arr[j+gap] = arr[j];
            }
            arr[j+gap] = temp;
        }
    }
    return arr;
}

归并排序Merge Sort

归并排序须知

作为一种典型的分而治之思想的算法应用归并排序的实现由两种方法

  1. 自上而下的递归所有递归的方法都可以用迭代重写所以就有了第2种方法
  2. 自下而上的迭代

在《数据结构与算法JavaScript描述》中作者给出了自下而上的迭代方法。但是对于递归法作者却认为

However, it is not possible to do so in JavaScript, as the recursion goes too deep

for the language to handle. 然而,在 JavaScript 中这种方式不太可行,因为这个算法的递归深度对它来讲太深了。

说实话我不太理解这句话。意思是JavaScript编译器内存太小递归太深容易造成内存溢出吗还望有大神能够指教。 更新 在《JavaScript语言精粹》的第四章里提到了递归问题。对我之前的疑问进行了解答

Some languages offer the tail recursion optimization. This means that if a function returns the result of invoking itself recursively, then the invocation is replaced with a loop, which can significantly speed things up. Unfortunately, JavaScript does not currently provide tail recursion optimization. Functions that recurse very deeply can fail by exhausting the return stack. 一些语言提供了尾递归优化。这意味着如果一个函数返回自身递归调用的结果那么调用的过程会被替换为一个循环它可以显著提高速度。遗憾的是JavaScript当前并没有提供尾递归优化。深度递归的函数可能会因为堆栈溢出而运行失败。

简而言之就是JavaScript没有对递归进行优化。运用递归函数不仅没有运行速度上的优势还可能造成程序运行失败。因此不建议使用递归。 再次更新 好消息好消息ES6已经添加了对尾递归优化的支持妈妈再也不用担心我用JavaScript写递归了。不过需要注意的是ES6的尾递归优化只在严格模式下才会开启。这样规定的原因在阮一峰的《ECMAScript6 入门》里解释得很清楚

正常模式下函数内部有两个变量可以跟踪函数的调用栈。 func.arguments返回调用时函数的参数。 func.caller返回调用当前函数的那个函数。 尾调用优化发生时函数的调用栈会改写因此上面两个变量就会失真。严格模式禁用这两个变量所以尾调用模式仅在严格模式下生效。

和选择排序一样归并排序的性能不受输入数据的影响但表现比选择排序好的多因为始终都是O(n log n的时间复杂度。代价是需要额外的内存空间。

归并排序动图演示

Merge Sort 动图演示 算法可视化来源http://visualgo.net/

归并排序JavaScript代码实现

function mergeSort(arr) {  //采用自上而下的递归方法
    var len = arr.length;
    if(len < 2) {
        return arr;
    }
    var middle = Math.floor(len / 2),
        left = arr.slice(0, middle),
        right = arr.slice(middle);
    return merge(mergeSort(left), mergeSort(right));
}

function merge(left, right)
{
    var result = [];
 
    while (left.length && right.length) {
        if (left[0] <= right[0]) {
            result.push(left.shift());
        } else {
            result.push(right.shift());
        }
    }
 
    while (left.length)
        result.push(left.shift());
 
    while (right.length)
        result.push(right.shift());
 
    return result;
}

快速排序Quick Sort

快速排序须知

又是一种分而治之思想在排序算法上的典型应用。本质上来看快速排序应该算是在冒泡排序基础上的递归分治法。 快速排序的名字起的是简单粗暴因为一听到这个名字你就知道它存在的意义就是快而且效率高! 它是处理大数据最快的排序算法之一了。虽然Worst Case的时间复杂度达到了O(n²)但是人家就是优秀在大多数情况下都比平均时间复杂度为O(n log n) 的排序算法表现要更好可是这是为什么呢我也不知道。。。好在我的强迫症又犯了查了N多资料终于在《算法艺术与信息学竞赛》上找到了满意的答案

快速排序的最坏运行情况是O(n²)比如说顺序数列的快排。但它的平摊期望时间是O(n log n) 且O(n log n)记号中隐含的常数因子很小比复杂度稳定等于O(n log n)的归并排序要小很多。所以对绝大多数顺序性较弱的随机数列而言快速排序总是优于归并排序。

更新 《算法 第四版》里对于快速排序的优缺点进行了更加明确的解释

快速排序的内循环比大多数排序算法都要短小这意味着它无论是在理论上还是在实际中都要更快。它的主要缺点是非常脆弱在实现时要非常小心才能避免低劣的性能。

快速排序动图演示

Quick Sort 动图演示 算法可视化来源http://visualgo.net/

快速排序JavaScript代码实现

function quickSort(arr, left, right) {
    var len = arr.length,
        partitionIndex,
        left = typeof left != 'number' ? 0 : left,
        right = typeof right != 'number' ? len - 1 : right;

    if (left < right) {
        partitionIndex = partition(arr, left, right);
        quickSort(arr, left, partitionIndex-1);
        quickSort(arr, partitionIndex+1, right);
    }
    return arr;
}

function partition(arr, left ,right) {     //分区操作
    var pivot = left,                      //设定基准值pivot
        index = pivot + 1;
    for (var i = index; i <= right; i++) {
        if (arr[i] < arr[pivot]) {
            swap(arr, i, index);
            index++;
        }       
    }
    swap(arr, pivot, index - 1);
    return index-1;
}

function swap(arr, i, j) {
    var temp = arr[i];
    arr[i] = arr[j];
    arr[j] = temp;
}

堆排序Heap Sort

堆排序须知

堆排序可以说是一种利用堆的概念来排序的选择排序。分为两种方法

  1. 大顶堆每个节点的值都大于或等于其子节点的值在堆排序算法中用于升序排列
  2. 小顶堆每个节点的值都小于或等于其子节点的值在堆排序算法中用于降序排列

堆排序动图演示

Heap Sort 动图演示 算法可视化来源http://www.ee.ryerson.ca/~courses/coe428/sorting/heapsort.html

堆排序JavaScript代码实现

var len;    //因为声明的多个函数都需要数据长度所以把len设置成为全局变量

function buildMaxHeap(arr) {   //建立大顶堆
    len = arr.length;
    for (var i = Math.floor(len/2); i >= 0; i--) {
        heapify(arr, i);
    }
}

function heapify(arr, i) {     //堆调整
    var left = 2 * i + 1,
        right = 2 * i + 2,
        largest = i;

    if (left < len && arr[left] > arr[largest]) {
        largest = left;
    }

    if (right < len && arr[right] > arr[largest]) {
        largest = right;
    }

    if (largest != i) {
        swap(arr, i, largest);
        heapify(arr, largest);
    }
}

function swap(arr, i, j) {
    var temp = arr[i];
    arr[i] = arr[j];
    arr[j] = temp;
}

function heapSort(arr) {
    buildMaxHeap(arr);

    for (var i = arr.length-1; i > 0; i--) {
        swap(arr, 0, i);
        len--;
        heapify(arr, 0);
    }
    return arr;
}

计数排序Counting Sort

计数排序须知

计数排序的核心在于将输入的数据值转化为键存储在额外开辟的数组空间中。 作为一种线性时间复杂度的排序计数排序要求输入的数据必须是有确定范围的整数。

计数排序动图演示

Counting Sort 动图演示 算法可视化来源http://visualgo.net/

计数排序JavaScript代码实现

function countingSort(arr, maxValue) {
    var bucket = new Array(maxValue+1),
        sortedIndex = 0;
        arrLen = arr.length,
        bucketLen = maxValue + 1;

    for (var i = 0; i < arrLen; i++) {
        if (!bucket[arr[i]]) {
            bucket[arr[i]] = 0;
        }
        bucket[arr[i]]++;
    }

    for (var j = 0; j < bucketLen; j++) {
        while(bucket[j] > 0) {
            arr[sortedIndex++] = j;
            bucket[j]--;
        }
    }

    return arr;
}

桶排序Bucket Sort

桶排序须知

桶排序是计数排序的升级版。它利用了函数的映射关系高效与否的关键就在于这个映射函数的确定。 为了使桶排序更加高效我们需要做到这两点

  1. 在额外空间充足的情况下尽量增大桶的数量
  2. 使用的映射函数能够将输入的N个数据均匀的分配到K个桶中

同时对于桶中元素的排序选择何种比较排序算法对于性能的影响至关重要。

什么时候最快Best Cases

当输入的数据可以均匀的分配到每一个桶中

什么时候最慢Worst Cases

当输入的数据被分配到了同一个桶中

桶排序JavaScript代码实现

function bucketSort(arr, bucketSize) {
    if (arr.length === 0) {
      return arr;
    }

    var i;
    var minValue = arr[0];
    var maxValue = arr[0];
    for (i = 1; i < arr.length; i++) {
      if (arr[i] < minValue) {
          minValue = arr[i];                //输入数据的最小值
      } else if (arr[i] > maxValue) {
          maxValue = arr[i];                //输入数据的最大值
      }
    }

    //桶的初始化
    var DEFAULT_BUCKET_SIZE = 5;            //设置桶的默认数量为5
    bucketSize = bucketSize || DEFAULT_BUCKET_SIZE;
    var bucketCount = Math.floor((maxValue - minValue) / bucketSize) + 1;   
    var buckets = new Array(bucketCount);
    for (i = 0; i < buckets.length; i++) {
        buckets[i] = [];
    }

    //利用映射函数将数据分配到各个桶中
    for (i = 0; i < arr.length; i++) {
        buckets[Math.floor((arr[i] - minValue) / bucketSize)].push(arr[i]);
    }

    arr.length = 0;
    for (i = 0; i < buckets.length; i++) {
        insertionSort(buckets[i]);                      //对每个桶进行排序这里使用了插入排序
        for (var j = 0; j < buckets[i].length; j++) {
            arr.push(buckets[i][j]);                      
        }
    }

    return arr;
}

基数排序Radix Sort

基数排序须知

基数排序有两种方法

  1. MSD 从高位开始进行排序
  2. LSD 从低位开始进行排序

基数排序 vs 计数排序 vs 桶排序

这三种排序算法都利用了桶的概念但对桶的使用方法上有明显差异 基数排序根据键值的每位数字来分配桶 计数排序每个桶只存储单一键值 桶排序每个桶存储一定范围的数值

LSD基数排序动图演示

Radix Sort 动图演示 算法可视化来源http://visualgo.net/

基数排序JavaScript代码实现

//LSD Radix Sort
var counter = [];
function radixSort(arr, maxDigit) {
    var mod = 10;
    var dev = 1;
    for (var i = 0; i < maxDigit; i++, dev *= 10, mod *= 10) {
        for(var j = 0; j < arr.length; j++) {
            var bucket = parseInt((arr[j] % mod) / dev);
            if(counter[bucket]==null) {
                counter[bucket] = [];
            }
            counter[bucket].push(arr[j]);
        }
        var pos = 0;
        for(var j = 0; j < counter.length; j++) {
            var value = null;
            if(counter[j]!=null) {
                while ((value = counter[j].shift()) != null) {
                      arr[pos++] = value;
                }
          }
        }
    }
    return arr;
}

写在最后

排序算法实在是博大精深还有hin多hin多我没有总结到或者我自己还没弄明白的算法仅仅是总结这十种排序算法都把我写哭了。。。 因此以后如果我掌握了更多的排序姿势我一定还会回来的

 

阿里云国内75折 回扣 微信号:monov8
阿里云国际,腾讯云国际,低至75折。AWS 93折 免费开户实名账号 代冲值 优惠多多 微信号:monov8 飞机:@monov6
标签: JavaScriptJava