• JS中对象数组用sort按属性排序


    前几天写过一篇 用js将HTML重新排序 的文章,其中用到sort来排序。
    那么,我们先来回顾下sort的用法:

    回顾

    Array.prototype.sort() 方法 用原地算法对数组的元素进行排序,并返回数组。默认排序顺序是先将元素转换为字符串,然后比较它们的UTF-16代码单元值序列时构建的。

    const months = ['March', 'Jan', 'Feb', 'Dec'];
    months.sort();
    console.log(months);
    //输出结果:["Dec", "Feb", "Jan", "March"]
    
    const array1 = [1, 30, 4, 21, 100000];
    array1.sort();
    console.log(array1);
    //输出结果:[1, 100000, 21, 30, 4]
    

    语法

    arr.sort([compareFunction])
    compareFunction:(可选)用来指定按某种顺序进行排列的函数。如果省略,元素按照转换为的字符串的各个字符的Unicode位点进行排序。
    返回值:排序后的数组。请注意,sort是在原数组基础上进行的排序,也就是会直接修改原数组。

    应用

    1.比较数字

    var numbers = [4, 2, 5, 1, 3]; 
    numbers.sort((a, b) => a - b); 
    console.log(numbers);
    
    // [1, 2, 3, 4, 5]
    

    既然我们知道了sort函数可以传入一个比较函数,那么我们来看看下面的例子。

    2.对象属性排序

    其实在我们实际开发中,经常会遇到这样的问题,我们收到后端传过来的数据,然后我们需要根据数据中的某一项来排序。
    比如有以下数据:

    var items = [
      { name: 'Edward', value: 21 },
      { name: 'Sharpe', value: 37 },
      { name: 'And', value: 45 },
      { name: 'The', value: -12 },
      { name: 'Zeros', value: 37 }
    ];
    

    1.按对象value排序

    // sort by value
    items.sort((a, b) => Number(a.value) - Number(b.value));
    

    结果如图所示:

    2.按对象name排序

    // sort by name
    items.sort(function(a, b) {
      //忽略大小写
      var nameA = a.name.toUpperCase();
      var nameB = b.name.toUpperCase();
      if (nameA < nameB) {
        return -1;
      }
      if (nameA > nameB) {
        return 1;
      }  
      //name相等时
      return 0;
    });
    

    结果如图所示:

  • 相关阅读:
    python爬虫笔记(3-1)re模块
    python爬虫笔记(2-2)xpath解析实例
    python爬虫笔记(2-1)Xpath解析
    python爬虫笔记(1-2)requests模块实例
    python爬虫笔记(1-1)requests模块:请求数据获取响应内容
    小程序上传图片,放大,删除。
    小程序中多个echarts折线图在同一个页面的使用
    vue传值 ---- >> 子传父,$emit()
    vue传值 ---- >> 父传子,props()
    离线webpack创建vue 项目
  • 原文地址:https://www.cnblogs.com/ZerlinM/p/13540799.html
Copyright © 2020-2023  润新知