JavaScript数组排序方法

黎明不管黑夜的星空

于 2023-04-17 16:48:00 发布

阅读量86

点赞数

分类专栏： Javascript 文章标签： javascript 前端经验分享

本文链接：https://blog.csdn.net/weixin_50930483/article/details/130203646

版权

Javascript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

一、双重循环(简单、粗暴排序)

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
</head>
<body>


    <script>
        // 定义数组
            // 数字可以比较大小
            // 数值从小到大  叫做升序
            // 数值从大到小  叫做降序
        var arr = [90,40,80,68,56];// 参与排序的数组
        var len = arr.length ;// 5
        var count = 0;
        for(var i = 0 ; i < len ; i ++ ){
            for(var j = 0 ; j < len-1 ;  j ++){ //  len-1 是为了避免索引值超出范围
                if(arr[j] < arr[j + 1] ){
                    var temp = arr[j]; // 把小的数值暂存起来
                    arr[j] = arr[j + 1];//把较大的数值赋值给前者
                    arr[j + 1] = temp;//把较小的数值赋值给后者
                }
                count ++;
            }
        }
        console.log(arr);// 排序之后的数组
        console.log(count);// 总共循环了20次

        // 数组排序:
            // 学习方式,建议用代入法,代入数值进行比较

    </script>
</body>
</html>

二、冒泡排序

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
</head>
<body>


    <script>
        // 冒泡排序
        // 特点：
            // 数组中的数值进行两两比较，然后交换位置，减少循环的次数
        // 定义数组
        var arr = [80,90,60,40,20];
        // 记录数组的长度
        var len = arr.length;
        // 计数器变量
        var count = 0;
        
        // 循环数组
        for(var i =  0 ; i < len ; i ++){
            // -i 表示减少执行重复比较的代码
            for(var j = 0 ; j < len - 1 - i ; j ++){
                // count ++;
                // 数据的两两比较
                if(arr[j] < arr[j + 1]){
                    // 暂存较小的值
                    var temp = arr[j];
                    // 把较大的值赋值给前者
                    arr[j] = arr[j + 1];
                    // 把暂存的值赋值给或者
                    arr[j + 1] = temp;
                }
            }
        }
        // 打印数组
        console.log(arr);// [90, 80, 60, 40, 20]
        // 打印循环的次数
        console.log("共循环了"+count+"次");// 10次

    </script>
</body>
</html>

三、数组中的sort方法

// 1.0 定义数组
        var arr = [80,40,70,60,8,9,20,100];
        // 调用者: arr
        // 参数: 匿名函数 (回调函数)
        // function(){} 在sort函数作用域中被调用了
        // 在sort函数封装过程中被调用了
        // 这个匿名函数同时具有形参
        var res1 = arr.sort(function(prev,next){
            return prev - next;// 升序
        })
        console.log(res1);// [20, 40, 60, 70, 80, 100]

        var res2 = arr.sort(function(prev,next){
            return next - prev;// 降序
        })
        console.log(res2);//  [100, 80, 70, 60, 40, 20]

四、插入排序

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
</head>
<body>


    <script>
        // 定义函数 返回有序的数组
        // 插入排序 : 
        // 把无序数组中的元素（A）和有序数组中的元素(O)进行对比
        // 把元素A插入到有序数组指定的位置（j）

        // 定义数组
        var arr = [100,80,20,90,60];

        // 第一次外部循环 
        // 有序数组                  无序数组 
        // [100]                     [100,80,20,90,60]
        // [80,100]                  [100,80,20,90,60]
        // [20, 80 , 100]            [100,80,20,90,60]
        // [20, 80 , 90 ,100]        [100,80,20,90,60]

        // 定义函数 insertSort
        function insertSort(elements) {
            // 外部循环
            for(var i = 0 ; i < elements.length ; i ++){
                // 定义变量,接收有序数组的下标(计算)
                var j =  i - 1;  
                // 定义变量，记录无序数组的每一个元素
                var temp =  elements[i]; 
                // 内不循环  elements[j] 
                while(j >= 0 && temp < elements[j]) {
                    // 把有序数组中较大的元素 往后移动一位
                    elements[j + 1] = elements[j];
                    // 为了找到准确的有序数组的下标
                    j -- ; 
                }
                // 在有序数组中插入元素 
                elements[ j + 1 ] = temp;
            }
            // 返回排序完成的数组
            return elements;
        }
        // 调用函数 insertSort
        var res = insertSort(arr);
        // 打印res输出
        console.log(res);//  [20, 60, 80, 90, 100]

    </script>
</body>
</html>

五、快速排序

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
</head>
<body>


    <script>

        // 快速排序（递归排序）
        // 基本思想：
            // 1. 找出数组的中间位置（偏）基准
            // 2. 划分三个数组，左边数组，中间数，右边数组
            // 3. 比如。升序的逻辑
            // 递归的方式，把较小的数值存放于左边数组，把较大数值存放于右边数组
            // 重复上述操作，一直到数组的length属性值小于等于1位置
 
        //  递归：
            // 1.函数的自身调用
            // 2.终止调用的条件

         // 定义数组
         var arr = [100,80,20,90,60];
         //  第一次执行函数  基准值 20
         // [].concat([20] , [60,90,80,100])  
         //  第二次执行函数  基准值 80
         // [].concat([20] , [60].concat([80],[100,90]))
         //   第三次执行函数  基准值 90
         // [].concat([20] , [60].concat([80],[].concat([90],[100])))
        //  等待递归函数执行完毕，就是一个排序完成的数组

        //  定义函数 quickSort 
        function quickSort(elements) {
            // 判断数组的length属性是否小于等于1
            if(elements.length <= 1){
                return elements;
            }
            // 找数组中偏中间的索引值（基准值）
            var midIndex = parseInt(elements.length / 2);
            // 找数组中偏中间的索引值的元素
            var middleVal = elements.splice(midIndex,1)[0];
            // middleVal = middleVal[0]
            // 定义左边数组
            var left_arr = [];
            // 定义右边的数组
            var right_arr = [];
            // 循环数组 elements 数组
            for(var i = 0 ; i < elements.length ; i ++){
                // 比较数组的元素 
                if(elements[i] < middleVal){
                    // 把较小的元素添加到左边数组
                    left_arr.push(elements[i]);
                }else {
                      // 把较大的元素添加到右边数组
                      right_arr.push(elements[i]);
                }
            }
            // 执行递归
            return quickSort(left_arr).concat([middleVal],quickSort(right_arr))
        }

        //  调用函数 quickSort 
        var res = quickSort(arr);
        console.log(res);// [20, 60, 80, 90, 100]




    </script>
</body>
</html>