javascript - 如何对对象数组进行分组和排序

标签 javascript reactjs

我得到了一个对象数组

const users= [{
Location: {
  label: "aa",
  value: "aa"
},
Name: "test7"
id: "002"
},
Location: {
  label: "aa",
  value: "aa"
},
Name: "test4"
id: "003"
},

{
Location: {
  label: "ss",
  value: "ss"
},
Name: "test4"     
id: "004"
}]

我想首先使用 Location.lable 然后使用名称(升序)对数组进行排序

这是我已经完成的操作,但它不起作用

const dynamicSort = property => {
var sortOrder = 1;
if (property[0] === "-") {
  sortOrder = -1;
  property = property.substr(1);
}
return function(a, b) {
  var result;
  if (property === "deviceLocation")
    result =
      a[property].label < b[property].label
        ? -1
        : a[property].label > b[property].label
        ? 1
        : 0;
  else
    result =
      a[property] < b[property] ? -1 : a[property] > b[property] ? 1 : 0;
  return result * sortOrder;
};
};
users.sort(dynamicSort("deviceLocation"))

结果应该是这样的:

const users= [{
  Location: {
  label: "aa",
  value: "aa"
},
Name: "test4"
id: "003"
},

Location: {
  label: "aa",
  value: "aa"
},
Name: "test7"
id: "002"
},

{
Location: {
  label: "ss",
  value: "ss"
},
Name: "test4"     
id: "004"
}]

如何首先使用 Location.label 然后使用 Name 对数组对象进行排序。我尝试了 lodash _.groupBy 排序后但没有成功

最佳答案

首先,您应该在问题中使用 JSON 或 JavaScript 对象。

然后,您可以创建一个排序函数,首先对用户位置的标签进行排序,然后对用户的名称进行排序。

console.log(getUsers().sort(userComparator));

function userComparator(userA, userB) {
  let diff = userA.Location.label.localeCompare(userB.Location.label);
  return diff === 0 ? userA.Name.localeCompare(userB.Name) : diff;
}

function getUsers() {
  return [{
    "Location": {
      "label": "colombo",
      "value": "colombo"
    },
    "Name": "test7",
    "id": "002"
  }, {
    "Location": {
      "label": "jaffna",
      "value": "jaffna"
    },
    "Name": "test4",
    "id": "004"
  }, {
    "Location": {
      "label": "colombo",
      "value": "colombo"
    },
    "Name": "test4",
    "id": "003"
  }];
}
.as-console-wrapper { top: 0; max-height: 100% !important; }

关于javascript - 如何对对象数组进行分组和排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60455989/

相关文章:

javascript - 菜单未显示在桌面显示屏上

javascript - jQuery 在 JSFiddle 中有效,但在本地 RoR 中无效。类型错误?

javascript - 如何修复 "Can' t 对未安装的组件执行 React 状态更新。React Native 中的错误

javascript - 如何在 ReactJS 中从 one.js 访问 isValid 变量到 two.js?

javascript - 通知组件全局事件的最佳方式

javascript - 组件渲染乱序

json - 在 Gatsby 中使用 graphQL 查询多个 JSON 文件

reactjs - React-apollo 中的 data.refetch() 函数如何工作

javascript - 调整窗口大小时限制居中div的水平范围

javascript - KnockoutJS 呈现具有多个模板和可变列数的表