js将数组中的对象的某一属性值的数组按照其内部的某一字段的值重新排序

最新推荐文章于 2025-05-12 14:05:54 发布
原创 最新推荐文章于 2025-05-12 14:05:54 发布 · 356 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#数据结构

文章讲述了如何使用JavaScript处理一个名为mockData的数组，该数组包含对象及其opInfoMap属性，opInfoMap是一个数组，需要按照taskStatus字段进行排序。通过定义一个sort函数并使用map方法遍历数据，实现了按taskStatus顺序排列opInfoMap内的对象。

原始数据，其内部 opInfoMap 数组中的数据是乱序排列的，希望其能按照 taskStatus 顺序排列

const mockData = [
      {
        areaId: "1701618149f89accf2c06549d2022eeb",
        areaName: "1215-活动6",
        opInfoMap: [
          {
            count: 836,
            percent: "82.53%",
            taskStatus: 4,
          },
          {
            count: 177,
            percent: "17.47%",
            taskStatus: 5,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 1,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 2,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 3,
          },
        ],
      },
      {
        areaId: "122687b5aa66018cd1a43fe9c7665071",
        areaName: "1215-活动10",
        opInfoMap: [
          {
            count: 2301,
            percent: "84.44%",
            taskStatus: 4,
          },
          {
            count: 423,
            percent: "15.52%",
            taskStatus: 5,
          },
          {
            count: 1,
            percent: "0.04%",
            taskStatus: 1,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 2,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 3,
          },
        ],
      },
    ];

期望格式：

const expectData = [
      {
        areaId: "1701618149f89accf2c06549d2022eeb",
        areaName: "1215-活动6",
        opInfoMap: [
          {
            count: 0,
            percent: "0%",
            taskStatus: 1,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 2,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 3,
          },
          {
            count: 836,
            percent: "82.53%",
            taskStatus: 4,
          },
          {
            count: 177,
            percent: "17.47%",
            taskStatus: 5,
          },
        ],
      },
      {
        areaId: "122687b5aa66018cd1a43fe9c7665071",
        areaName: "1215-活动10",
        opInfoMap: [
          {
            count: 1,
            percent: "0.04%",
            taskStatus: 1,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 2,
          },
          {
            count: 0,
            percent: "0%",
            taskStatus: 3,
          },
          {
            count: 2301,
            percent: "84.44%",
            taskStatus: 4,
          },
          {
            count: 423,
            percent: "15.52%",
            taskStatus: 5,
          },
        ],
      },
    ];

实现：

const sortopInfoMapData = (data, name) => {
    const sortBy = (field) => {
      //根据传过来的字段进行排序
      return (x, y) => {
        return x[field] - y[field];
      };
    };
    data.map((obj) => {
      obj.opInfoMap.sort(sortBy(name));
      return obj;
    });
    return data;
  };

sortopInfoMapData(mockData, 'taskStatus')

js sort方法根据数组中对象的某一个属性值将数组进行排序，如成绩排序
钱小端~
01-10 1354
当我们需要从后端直接获取或者处理过的数组对象根据某属性进行排序时，使用sort方法可以直接实现 根据列表中成绩对数组进行排序 score为比较的值，这里是成绩，也可以是年龄age、数量num等等 obj1、obj2这里可看做新定义的一个变量数组，直接用即可 不需定义 不代表任何数据 scoreArr 为需要排序的数组 function objectSort(score) { // 比较函数通过score属性获得对象的成绩进行比较，将**比较函数**作为函数返回值返回给sort return fun
基于JavaScript实现Json数据根据某个字段进行排序
01-21
一.首先给大家介绍js中内置的 sort() 方法 此方法默认是按字母顺序对数组中的元素进行排序的，说得更精确点，是按照字符编码的顺序进行排序。 看如下例子： 当数组中元素为 数字类型 时，排序结果与我们设想的完全不同，因为默认是按照字符编码的顺序进行排序的。 解决方案：sort() 方法接收一个可选参数(此参数必须是函数)，我们可以自己定义排序规则，如下图 二.  对 json 排序的具体实现 /* * @description 根据某个字段实现对json数组的排序 * @param array 要排序的json数组对象 * @param
js数组根据对象的某一个字段排序
weixin_41166309的博客
04-11 1682
js数组根据对象的某一个字段排序
js对某个对象数组按照某个字段来排序
树上骑个猴的博客
03-07 1万+
let arr1 = [ {count:1,name:'小米'}, {count:3,name:'华为'}, {count:2,name:'苹果'} ] function sortBy (field) { //根据传过来的字段进行排序 return (x, y) => { return x[field] - y[field] } } arr1.sort(sortBy('count')) //[{count:1,name:'小米'}
JS对数组对象按照某个字段进行排序
许粤军的博客
09-13 3454
function sortByKey(array, key, order) { return array.sort(function(a, b) { var x = a[key]; var y = b[key] if (order) { return ((x < y) ? -1 : ((x > y) ? 1 : 0)) } else { return ((x < y) ? ((x > y) ? 1 : 0) : -1) }.
js数组根据某一字段排序
热门推荐
尘封的落叶的博客
05-14 1万+
需要排序数组以及排序字段为rank： let data=[{text:"测试01"，value:1，rank:1},{text:"测试02"，value:2，rank:2},{text:"测试03"，value:3，rank:3}] 排序： this.data.sort((a, b) => { return a.rank > b.rank ? 1 : -1; }) 排序结果： this.data=[{text:"测试03"，value:3，rank:3},{text:"测试02"，
JS实现根据数组对象的某一属性排序操作示例
10-17
然后定义了一个名为`compare`的函数，这个函数接收一个参数`property`，它是字符串类型，代表对象中需要根据其值进行排序的属性名。 `compare`函数返回一个新的函数，这个返回的函数才是实际的比较函数。在`compare...
vue 根据数组中某一项的值进行排序的方法
10-18
本文将详细介绍如何在Vue中根据数组中某一项的值进行排序。 一、基本概念 在JavaScript中，数组有一个内置的`sort()`方法，它可以接受一个比较函数作为参数，用于自定义排序规则。Vue中的数据响应性机制允许我们在...
JS sort方法基于数组对象属性值排序
10-15
本篇将详细介绍如何利用`sort`方法实现基于数组对象属性值的排序。 首先，`sort`方法接受一个比较函数作为参数。这个比较函数定义了如何比较数组中的两个元素。在处理对象数组时，比较函数通常会获取对象的属性值，...
js 根据对象数组中的属性进行排序实现代码
10-16
在JavaScript中，处理数据时经常需要对数组进行排序，特别是当数组包含对象时，我们可能需要根据对象的某个属性来排序。本文将深入探讨如何使用JavaScript实现这一功能。 首先，JavaScript的`Array.prototype.sort...
数组对象 按照对象中的某个字段排序
MtangEr的博客
05-12 725
按照对象中的某个字段对数组进行排序
js数组对象根据某一key属性字段排序
weixin_50367873的博客
04-19 641
【代码】js数组对象根据某一字段排序。
js对象按某个字段排序
07-19 915
var arr = [ {name:'zopp',age:0}, {name:'gpp',age:18}, {name:'yjj',age:8} ]; function compare(property){ return function(a,b){ var value1 = a[property]; var value2 = b[property]; retu...
JS实现根据数组对象的某一属性排序，汉字排序
徊忆羽菲
02-20 3515
JS实现根据数组对象的某一属性排序、汉字排序、中文排序
JavaScript实现对象数组按不同字段排序
ABS1118的专栏
07-11 2624
假设有一个对象数组，我们想要根据某个对象属性对数组进行排序，而传递给数组sort（）方法的比较函数要接收两个参数，即要比较的值。可是，我们需要一种方式来指明按照哪个属性来排序。要解决这个问题，可以定义一个函数，它接收一个属性名，然后根据这个属性名来创建一个比较函数，下面就是这个函数的定义。 function createComparionFun(propertyName){ return f
js根据数组中的某个字段排序
hexu_blog的博客
11-09 2147
【代码】js根据数组中的某个字段排序。
javascript sort()方法对对象某一个字段进行排序
yt0926的博客
04-17 2283
文章目录一、使用环境二、使用方法三、效果 一、使用环境 使用sort()方法根据数组对象某一字段的值进行排序 二、使用方法 对n个对象内的shopPrice字段进行从小到大排序 排序前 代码如下（示例）： shopPrice(){. this.sort('shopPrice');//调用sort方法，传入字段名 } sort(type) { this.categoryRelationListPrice_New.sort(this.compare(type));调用c
JS中根据对象中的一个字段进行排序
weixin_44419615的博客
07-31 2064
let arr = [ {name: '张三',age: 18}, {name: '李四',age: 9}, {name: '王五',age: 28} ] //定义方法 const handle = (property) => { return function(a,b){ const val1 = a[property]; const val2 = b[...
重新排序数组中的对象（根据对象中的某个属性来排列）
dibitui7403的博客
08-07 211
将数据从大到小排序： 转载于:https://www.cnblogs.com/dreamhouse/p/9437973.html
根据对象数组中某一元素值按照从大到小排序
最新发布
07-02
在 JavaScript 中，对对象数组根据某一属性值进行排序是一种常见的操作。可以通过 `Array.prototype.sort()` 方法结合一个比较函数实现这一功能。以下是具体实现方式： ### 对象数组按属性降序排序 要根据对象数组中某个属性的值进行 **降序排序**，可以在调用 `sort()` 方法时提供一个自定义的比较函数。该函数接收两个参数（通常命名为 `a` 和 `b`），分别代表数组中的两个元素。 例如，假设有一个包含多个对象的数组 `people`，每个对象都有一个 `age` 属性，希望按照 `age` 从大到小排序： ```javascript const people = [ { name: "Alice", age: 25 }, { name: "Bob", age: 30 }, { name: "Charlie", age: 20 } ]; people.sort((a, b) => b.age - a.age); console.log(people); // 输出: [ { name: 'Bob', age: 30 }, { name: 'Alice', age: 25 }, { name: 'Charlie', age: 20 } ] ``` 上述代码中，`sort()` 方法接受了一个箭头函数 `(a, b) => b.age - a.age` 作为比较函数，它确保数组按照 `age` 属性的值从高到低排序[^4]。 ### 更通用的方法：使用函数封装 如果需要多次执行此类排序操作，可以将逻辑封装成一个函数。例如，以下函数 `sortByProperty` 接受一个属性名和排序方向（升序或降序）作为参数，并返回一个适用于 `sort()` 的比较函数： ```javascript function sortByProperty(property, descending = true) { return function (a, b) { const valueA = a[property]; const valueB = b[property]; if (descending) { return valueB - valueA; } else { return valueA - valueB; } }; } // 示例：按 age 降序排序 const sortedPeople = people.sort(sortByProperty("age", true)); console.log(sortedPeople); // 输出: [ { name: 'Bob', age: 30 }, { name: 'Alice', age: 25 }, { name: 'Charlie', age: 20 } ] ``` 这种方法提高了灵活性，允许动态指定排序字段和顺序[^5]。 ### 处理字符串属性排序 当排序依据是字符串属性（如姓名）时，JavaScript 的 `localeCompare()` 方法可以用于比较字符串。例如，按 `name` 字母顺序排序： ```javascript people.sort((a, b) => a.name.localeCompare(b.name)); console.log(people); // 输出: [ { name: 'Alice', age: 25 }, { name: 'Bob', age: 30 }, { name: 'Charlie', age: 20 } ] ``` 此方法支持本地化排序规则，适用于多语言环境下的字符串比较[^2]。 ### 总结 - 使用 `sort()` 方法配合比较函数可以轻松实现对象数组按属性排序。 - 比较函数决定了排序顺序，降序可通过 `b[property] - a[property]` 实现。 - 可以通过封装函数提高代码复用性和可维护性。 - 对于字符串属性，推荐使用 `localeCompare()` 方法进行比较。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值