--- theme: channing-cyan --- ### 1. 前言算法为王。想学好前端，先练好内功，内功不行，就算招式练的再花哨，终究成不了高手；只有内功深厚者，前端之路才会走得更远。本文中包含了十大经典排序算法的思想、代码实现、一些例子、复杂度分析。这应该是目前最全的 JavaScript 十大经典排序算法的讲解了吧。 ### 准备 **排序算法的稳定性**：排序前后两个相等的数相对位置不变，则算法稳定。 **时间复杂度**: 简单的理解为一个算法执行所耗费的时间，一般使用大O符号表示法，详细解释见时间复杂度 **空间复杂度**: 运行完一个程序所需内存的大小。常见算法的复杂度（图片来源于网络） ![嘻嘻嘻](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/e3aeadbf43f94c9f93f016e271c2ffa9~tplv-k3u1fbpfcp-watermark.image) 以下算法最频繁的操作就是交换数组中两个元素的位置（按照正序或者是逆序），简单抽出一个函数如下： ```js/** * 按照正序比较并交换数组中的两项 * * @param {Array} ary * @param {*} x * @param {*} y */ function swap(ary, x, y) { if (x === y) return var temp = ary[x] ary[x] = ary[y] ary[y] = temp } ``` ### 冒泡排序（Bubble-Sort）冒泡排序是一种简单的排序算法。它重复地走访过要排序的数列，一次比较两个元素，如果他们的顺序错误就把他们交换过来。走访数列的工作是重复地进行直到没有再需要交换，也就是说该数列已经排序完成。这个算法的名字由来是因为越小的元素会经由交换慢慢“浮”到数列的顶端。 **解题思路**：从数组的第一位开始，依次向后比较相邻元素的大小，如果前一个比后一个小，那么交换二者位置，直至数组末尾。下一轮比较的起始位置加1，然后重复第一步。重复1~2，直至排序结束。 ```js //bubbleSort.js Array.prototype.bubbleSort = function(){//数组的实例没有这个方法,但是其原型上有这个方法,我们照样可以调用这个方法 for(let i=0;ithis[j+1]){ const temp = this[j]; this[j]=this[j+1]; this[j+1]=temp } } //this 就是数组 console.log(this[j],this[j+1]) } } const arr = [5,4,3,2,1] arr.bubbleSort(); //时间复杂度O(n^2) // 空间复杂度 O(1) ``` 优化：当某次冒泡操作已经没有数据交换时，说明已经达到完全有序，不用再继续执行后续的冒泡操作。 ```js / 冒泡排序（已优化） //bubbleSort.js Array.prototype.bubbleSort = function(){//数组的实例没有这个方法,但是其原型上有这个方法,我们照样可以调用这个方法 for(let i=0;ithis[j+1]){ const temp = this[j]; this[j]=this[j+1]; this[j+1]=temp; hasChange = true; // 表示有数据交换 } } if (!hasChange) break; // 如果 false 说明所有元素已经到位，没有数据交换，提前退出 //this 就是数组 console.log(this[j],this[j+1]) } } const arr = [5,4,3,2,1] arr.bubbleSort(); ``` ### 选择排序选择排序是先在数据中找出最大或最小的元素，放到序列的起始；然后再从余下的数据中继续寻找最大或最小的元素，依次放到排序序列中，直到所有数据样本排序完成。复杂度分析：很显然，选择排序也是一个费时的排序算法，无论什么数据，都需要O(n*n) 的时间复杂度，不适宜大量数据的排序。 **解题思路**：首先在未排序序列中找到最小（大）元素，存放到排序序列的起始位置。再从剩余未排序元素中继续寻找最小（大）元素，然后放到已排序序列的末尾。重复第二步，直到所有元素均排序完毕。 ```js //selectionSort.js Array.prototype.selectionSort = function(){ for(let i=0;i0){ if(this[j-1]>temp){ this[j]=this[j-1] }else{ break; } j--; } this[j] = temp } } const arr = [5,4,3,2,1] arr.insertionSort(); //时间复杂度O(n^2) // 空间复杂度 O(1) ``` ### 归并排序归并排序是利用归并的思想实现的排序方法，该算法采用经典的分治（divide-and-conquer）策略（分治法将问题分(divide)成一些小的问题然后递归求解，而治(conquer)的阶段则将分的阶段得到的各答案"修补"在一起，即分而治之)。 **解题思路**：把长度为n的输入序列分成两个长度为n/2的子序列；对这两个子序列分别采用归并排序；将两个排序好的子序列合并成一个最终的排序序列。 ```js //mergeSort Array.prototype.mergeSort = function(){ const rec = (arr)=>{ if(arr.length ===1){return arr ;} const mid = Math.floor(arr.length/2); const left = arr.slice(0,mid); const right= arr.slice(mid,arr.length); const orderLeft = rec(left); const orderRight = rec(right); const res =[] while(orderLeft.length||orderRight.length){ if(orderLeft.length&&orderRight.length) { res.push(orderLeft[0]{ this[i]=n }) } const arr = [5,4,3,2,1] arr.mergeSort(); // 分 O(logn) // 合 O(n) //时间复杂度O(nlogn) // 空间复杂度 O(1) ``` ### 快速排序快速排序使用分治法策略来把一个数组分为两个子数组。首先从数组中挑出一个元素，并将这个元素称为「基准」，英文pivot。重新排序数组，所有比基准值小的元素摆放在基准前面，所有比基准值大的元素摆在基准后面（相同的数可以到任何一边）。在这个分区结束之后，该基准就处于数组的中间位置。这个称为分区（partition）操作。之后，在子序列中继续重复这个方法，直到最后整个数据序列排序完成。 **解题思路**：从数列中挑出一个元素，称为 "哨兵"（pivot）；重新排序数列，所有元素比哨兵值小的摆放在哨兵前面，所有元素比哨兵值大的摆在哨兵的后面（相同的数可以到任一边）。在这个分区退出之后，该哨兵就处于数列的中间位置。这个称为分区（partition）操作；递归地把小于哨兵值元素的子数列和大于哨兵值元素的子数列排序。 ```js //quickSort Array.prototype.quickSort = function(){ const rec =()=>{ if(arr.length ===1){return arr;} const left =[] const right = [] const mid = arr[0]; for(let i=1;i{this[i]=n}) } const arr = [5,4,3,2,1] arr.quickSort(); // 递归 O(logn) // 分区 O(n) //时间复杂度O(nlogn) // 空间复杂度 O(1) ``` ### 总结刷题打卡第四天，选择面试经常问的排序算法、一起加油哇~ ### ❤️ 感谢大家如果你觉得这篇内容对你挺有有帮助的话：点赞支持下吧，让更多的人也能看到这篇内容（收藏不点赞，都是耍流氓 -_-）关注公众号**给npy的前端秘籍**，我们一起学习一起进步。觉得不错的话，也可以阅读其他文章（感谢朋友的鼓励与支持🌹🌹🌹） [开启LeetCode之旅](https://juejin.cn/post/6964031379654836254) [LeetCode之双指针](https://juejin.cn/post/6964726356542226446) [LeetCode27、移除元素](https://juejin.cn/post/6965064415997591582) ### 参考： [手撕排序算法](https://juejin.cn/post/6844903793923096590#heading-7)