微信小程序js数组对象根据某个字段排序

news/2024/7/20 1:04:29 标签: 微信小程序, javascript, 小程序

一、排序栗子

        注:        属性字段需要进行转换,如String类型或者Number类型

//升序排序  首元素(element1)在前   降序则(element1)元素在后
data = data.sort((element1, element2) =>
      element1.属性 - element2.属性
);

二、代码 

Page({

  /**
   * 页面的初始数据
   */
  data: {
    user: [
      {'id': 1,"age": 10,"name": "黑大帅"},
      {'id': 3,"age": 5,"name": "懒洋洋"},
      {'id': 2,"age": 7,"name": "小灰灰"},
    ],
    location: [
      {'id': 3334,'km': '142.14KM','address': '上海市-黄埔区-打浦路1号'},
      {'id': 3399,'km': '145.73KM','address': '上海市-黄浦区-中山东二路'},
      {'id': 5865,'km': '142.98KM','address': '上海市黄浦区徐家汇268号luOne凯德晶萃广场'},
    ]
  },

  sortArray() {
    console.log("位置信息:");
    console.log(this.data.location);
    console.log("用户信息:");
    console.log(this.data.user);

    console.log("排序后数据===============================");

    console.log("位置信息:");
    //根据距离从小到大排序
    let locationSort = []
    locationSort = this.data.location.sort((el1, el2) =>
      el1.km.split("KM")[0] - el2.km.split("KM")[0]
    );
    console.log(locationSort);
    
    console.log("用户信息:");
    // 根据年龄从大到小排序
    let userSort = []
    userSort = this.data.user.sort((item1, item2) =>
      item2.age-item1.age
    );
    console.log(userSort);
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let that = this
    that.sortArray()
  },

})
  • 排序前数据(乱序输出)

  • 排序后数据(
  • 用户根据年龄从大到小输出,
  • 位置根据km从小到大输出) 


http://www.niftyadmin.cn/n/5245847.html

相关文章

dockers安装rabbitmq

RabbitMQ: easy to use, flexible messaging and streaming — RabbitMQhttps://www.rabbitmq.com/ Downloading and Installing RabbitMQ — RabbitMQ docker run -it --rm --name rabbitmq -p 5672:5672 -p 15672:15672 rabbitmq:3.12-management 之后参照:dock…

【ARM Trace32(劳特巴赫) 使用介绍 13 -- Trace32 变量篇】

文章目录 Trace32 查看变量值Var.view 查看变量值Var.view 查看数据类型的大小Var.view 根据变量地址查看变量值 Trace32 查看变量值 步骤1 步骤2 步骤3: 步骤4: 查看结构体变量 str_t32 的值 struct t32_str {uint32_t t32_val;uint32_t …

【文件上传系列】No.0 利用 FormData 实现文件上传、监控网路速度和上传进度(原生前端,Koa 后端)

利用 FormData 实现文件上传 基础功能:上传文件 演示如下: 概括流程: 前端:把文件数据获取并 append 到 FormData 对象中后端:通过 ctx.request.files 对象拿到二进制数据,获得 node 暂存的文件路径 前端…

剑指YOLOv5独家最新改进(全网无重复)《感知聚合SERDetect检测头》高效涨点,即插即用|检测头新颖改进

💡本篇内容:YOLOv5独家最新改进《感知聚合SERDetect检测头》高效涨点,即插即用|检测头新颖改进 💡🚀🚀🚀本博客 YOLO系列 + 感知聚合SERDetect检测头 改进创新点改进源代码改进 适用于 YOLOv5 按步骤操作运行改进后的代码即可 💡附改进源代码及教程,适合用来…

微信小程序适配方案:rpx(responsive pixel响应式像素单位)

小程序适配单位:rpx 规定任何屏幕下宽度为750rpx 小程序会根据屏幕的宽度自动计算rpx值的大小 Iphone6下:1rpx 1物理像素 0.5css 小程序编译后,rpx会做一次px换算,换算是以375个物理像素为基准,也就是在一个宽度…

微信可以设置自动回复了!秒回客户信息

你有没有为了回复微信消息,中断工作进度,耽误了大量时间?或者错过了潜在客户?现在,我们的微信管理系统,可以帮助你在第一时间,实时回复用户消息。 01 # 通过好友自动打招呼# 我们的微信管理系…

micro_ros_setup包镜像及部分注释(我觉得此包支持很有限)

GitHub - micro-ROS/micro_ros_setup at humble README.md This ROS 2 package(这是一个包) is the entry point for building micro-ROS apps for different embedded platforms. Supported platforms Standalone build system toolsDependenciesQuick startBuilding Creati…

提升Python项目整洁度:深入使用 import-linter

更多资料获取 📚 个人网站:ipengtao.com 在复杂的Python项目中,良好的代码组织结构是维护性和可读性的关键。本文将深入研究 import-linter 工具,它是一个强大的静态分析工具,旨在优化项目的模块导入,提高…