2020-09-14

参考: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>

转载于:https://blog.csdn.net/weixin_39644462/article/details/83660530?utm_source=po_vip

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值