js数组排序输出

最新推荐文章于 2024-05-11 01:45:00 发布
最新推荐文章于 2024-05-11 01:45:00 发布
阅读量2.1k 收藏 3
点赞数 1
分类专栏： web前端 javascript 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_39644462/article/details/83660530
版权

项目要求，需要在前端做筛选排序，数据都是用ajax向服务器请求返回json数据
参考：https://blog.csdn.net/bobobocai/article/details/78028497

用到js 的sort()方法

 

定义和用法

sort() 方法用于对数组的元素进行排序。

参数描述
sortby可选。规定排序顺序。必须是函数。

 

返回值

对数组的引用。请注意，数组在原数组上进行排序，不生成副本。

 

说明

如果调用该方法时没有使用参数，将按字母顺序对数组中的元素进行排序，说得更精确点，是按照字符编码的顺序进行排序。要实现这一点，首先应把数组的元素都转换成字符串（如有必要），以便进行比较。

如果想按照其他标准进行排序，就需要提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：

  • 若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
  • 若 a 等于 b，则返回 0。
  • 若 a 大于 b，则返回一个大于 0 的值。

更多资料可以看：http://www.w3school.com.cn/jsref/jsref_sort.asp
下面贴代码

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>js数组排序输出</title>
    <script src="http://www.xxiaoyuan.top/jquery-1.9.1.js"></script>
</head>
<body>
    <div class="box">
        <ul>
        </ul>
    </div>
</body>
<script>
    $(function () {
        var Obj = [
            {
                id:20,
                name:"Back",
                age:26,
                sex:"男"
            },
            {
                id:21,
                name:"Jun",
                age:19,
                sex:"男"
            },
            {
                id:22,
                name:"Mark",
                age:36,
                sex:"女"
            },
            {
                id:23,
                name:"Tony",
                age:23,
                sex:"男"
            }
        ];
        //定义一个函数
        function compare(pro) { 
            return function (obj1, obj2) { 
                var val1 = obj1[pro]; 
                var val2 = obj2[pro]; 
                if (val1 < val2 ) { //正序
                    return 1; 
                } else if (val1 > val2 ) { //倒序
                    return -1; 
                } else { 
                    return 0; 
                } 
            } 
        } 
        //按年龄降序排序
        var pai = Obj.sort(compare("age"));
        console.log(pai);
        for(var i in pai){
            $(".box ul").append(`
                <li>
                    姓名：<span>${Obj[i].name}</span>
                    年龄：<span>${Obj[i].age}</span>
                    性别：<span>${Obj[i].sex}</span>
                </li>
            `);
        }
    });
</script>
</html>

上面代码可以直接复制用，自己控制台打印看看，

攻城狮YanGo
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js实现数组翻转（倒序输出）
weixin_48249606的博客
09-28 1479
//倒序排列 var arr=[2,30,1,9,5,7]; var brr=arr.reverse(); for(var i=0;i<brr.length;i++){ document.write(brr[i]); } console.log(brr);//控制台也能看到数组的输出
javascript 输出一组数字的全部排列组合
weixin_55559151的博客
11-18 539
JavaScript输出一组数字的全部排列组合
【JavaScript】内置对象 - 数组对象 ③ ( 数组反转 - reverse 方法 | 数组排序 - sort 方法 | 自定义数组排序规则 )
最新发布
让 学习 成为一种 习惯 ( 韩曙亮 の 技术博客 )
05-11 1000
一、数组排序 1、翻转数组元素 - reverse() 2、数组元素排序 - sort() 默认从小到大排序 3、数组元素排序 - sort() 自定义排序规则 4、数组元素排序 - sort() 自定义降序排序简化写法
js对数组按顺序排序
diemei3272的博客
02-25 289
console.log("------默认排序(ASCII字符排序)------"); var arr = [1,2,55,12,88]; arr.sort(); //ASCII字符代码从小到大排序 console.log(arr.toString()); console.log("------自定义函数排序------"); var arr...
JavaScript实现一个数组，按照数字出现的频率排序输出
qq_43627280的博客
10-21 1594
JavaScript实现一个数组，按照数字出现的频率排序输出 大致思路： 将数组的数据和出现次数通过键值对（对象）的形式储存起来，不存在，value值设为1，存在，value值加1. 通过Object.key得到一个obj的key值组成的数组。 对数组进行排序，通过obj的value对key进行排序 注：排序方法sort((i,j) => obj[j]-obj[i]) 遍历数组每一项，在循环对象中数组每一项对应的value次数，再依次插入新数组中。 var arr = [1,2
JavaScript 对于数组Array的排序，给数字排序、给数字排序，对象排序，控制内容输出循序
kouryoushine的博客
06-25 872
测试数据和代码 (a,b)=>(a.score - b.score) 是lambda表达式，等同于funtion sort(function(a,b){return a-b;}); 排序原理：是根据return值的正负数，决定a和b谁排序靠前。 <script> var data=[ {name:'A三',url:"http://www.baidu.com...
js中数组逆序输出
weixin_45803990的博客
07-25 6942
js中数组逆序输出(一) <script> function reverse(array) { var newArray = [];//定义的新数组是为了接收翻转之后的数组的 for (var i = 0; i < array.length; i++) { // unshift 是让数据插入到数组的前面 newArray.unshift(array[i]);//
JavaScript数值数组排序示例分享
12-09
在JavaScript中，数组排序是一个常见的操作，特别是在处理数值数据时。然而，JavaScript的`Array.prototype.sort()`方法在默认情况下，并不总是按照预期的数字顺序进行排序。这是因为`sort()`方法默认将数组元素转换...
Javascript 数组排序详解
10-25
JavaScript中的数组排序功能主要通过`Array.prototype.sort()`方法实现，这个方法可以对数组中的元素进行排序，无论是简单数据类型还是复杂的数据结构如多维数组或包含对象的数组。`sort()`方法的核心在于可选的`...
javascript 数组排序与对象排序的实例
10-19
在JavaScript中，数组排序是通过`Array.prototype.sort()`方法实现的。默认情况下，`sort()`函数会按照字典顺序对数组中的元素进行排序，这在处理数字时可能不会得到预期的结果。例如，数组`[2, 98, 34, 45, 78, 7, ...
js中的数组对象排序分析
10-17
首先，`sort()`方法是JavaScript数组对象的一个内置方法，用于对数组进行排序。默认情况下，如果数组元素是字符串，`sort()`会按照ASCII值顺序进行排序；如果是数字，由于隐式转换，它会将数字转换为字符串再进行...
js for循环倒序输出数组元素的实例
12-11
实例如下： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>倒序输出数组元素</title> </head> <body> [removed] var a=[1,2,3,4] for(var i=a.length-1;i>=0;i--){ [removed](a[i]+'');} [removed] hellp </body> </html> 以上这篇js for循环倒序输出数组元素的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持
JS简单数组排序操作示例【sort方法】
10-16
在JavaScript中，数组排序是一个常见的任务，`sort()`方法提供了便捷的方式来实现这一功能。本篇文章将深入探讨`sort()`方法的使用，以及如何通过自定义比较函数实现复杂排序。 `Array.prototype.sort()`方法用于...
JS 数组逆序输出
qq_36437172的博客
01-19 4341
JS 数组逆序输出，即反转数组 1.for 倒序输出 var arr = [1, 2, 3] for (var i = arr.length - 1; i >= 0; i--) { console.log(arr[i]) // 3 2 1 } 2.reverse var str = 'hi' console.log(str.split('').reverse().join('')) // ih 3.for 元素前后调换 var arr = [1, 2, 3] var temp
使用js实现数组逆序
啊哈前端的专栏
04-11 8066
js数组逆序 var array=[1,2,3,4,5,6,7,8,9]; for(var i=0,length=array.length;i<length;i++){ var halfIndex=length%2==0?halfIndex=length/2:Math.ceil(length
JS遍历并输出一个数组
weixin_46007921的博客
04-27 942
JS遍历并输出一个数组 const data = await this.$_api.getOptionsList({ sortType: sortType, count: count }); console.log(data); let leftData = JSON.parse(data.data); for(let item of leftData){ console.log(1); let key = item.optionKey; console.log(key);
js算法-数组中重复元素按照从大到小的排序输出
nahedan的博客
10-25 907
算法题：给你一个数组，按照数组元素重复元素从大到小顺序依次输出（重复元素相同按照先出现的排在前面） 示例： 数组：[5,19,19,12,19,19,15,5,12,5,12,12,15] 结果：[19,12,5,15] 分析：原数组中元素值为5有3个，值为19有4个，值为12有4个，值为15有2个，重复元素个数相同按照先出现的排在前面，19排在12前面，结果为[ 19, 12, 5, 15 ] 最近遇到一道算法题：发现网上没有相关的js解法。 1.解法一：对象存储值和数量 var foo = func
输出数组的全排列方法
jingchengsuoz的专栏
06-27 913
参考：点击打开链接 1 递归方法求全排列 // 数组的全排列.cpp : 定义控制台应用程序的入口点。 //程序猴6.27 #include "stdafx.h" template void Swap(T &A,T &B) { T Tmp = A; A = B; B = Tmp; } //判重复元素函数，如果第[Begin,End)之间有元素和第End元素相等，则不执行交换Beg
js数组倒叙输出
weixin_34293246的博客
11-22 363
第一种：是直接利用代码进行输出 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>倒序输出数组元素</title> </head> <body> <script type="tex...
javascript数组排序
10-05
JavaScript中有多种排序方法可以对数组进行排序。根据提供的引用内容，我们可以使用以下几种方法进行排序： 方法一：使用sort()函数和自定义比较函数进行排序。可以通过传入一个比较函数作为参数来指定排序的方式。比较函数接受两个参数a和b，如果a应该排在b的前面，则返回一个负数，如果a应该排在b的后面，则返回一个正数，如果a和b相等，则返回0。例如，可以使用该方法对数组arr进行排序： var arr = [123, 203, 23, 13, 34, 65, 65, 45, 89, 13, 1]; function compare(a, b) { return a - b; } arr.sort(compare); console.log(arr); // 输出：[1, 13, 13, 23, 34, 45, 65, 65, 89, 123, 203] 方法二：使用快速排序算法进行排序。快速排序是一种分治的排序算法，它通过选择一个基准元素，把数组分成两个子数组，将小于基准的元素放在左边，将大于基准的元素放在右边，然后递归地对子数组进行排序。可以使用以下代码实现快速排序： var arr = [123, 203, 23, 13, 34, 65, 65, 45, 89, 13, 1]; function quickSort(arr) { if (arr.length <= 1) { return arr; } var pivotIndex = Math.floor(arr.length / 2); var pivot = arr.splice(pivotIndex, 1); 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)); } console.log(quickSort(arr)); // 输出：[1, 13, 13, 23, 34, 45, 65, 65, 89, 123, 203] 方法三：使用冒泡排序算法进行排序。冒泡排序是一种简单的排序算法，它通过多次遍历数组，比较相邻元素的大小并交换位置，将较大的元素逐步“冒泡”到数组的末尾。可以使用以下代码实现冒泡排序： var arr = [123, 203, 23, 13, 34, 65, 65, 45, 89, 13, 1]; for (var i = 0; i < arr.length - 1; i++) { for (var j = 0; j < arr.length - 1 - i; j++) { if (arr[j] > arr[j + 1]) { var temp = arr[j]; arr[j] = arr[j + 1]; arr[j + 1] = temp; } } } console.log(arr); // 输出：[1, 13, 13, 23, 34, 45, 65, 65, 89, 123, 203] 以上是三种常见的JavaScript数组排序方法。根据不同的需求和数据规模，选择不同的排序方法可以提高排序效率。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值