javascript - 如何在 Javascript 中对 Array map() 函数输出进行排序

Question

我想在使用map()函数后对项目进行排序。但排序必须基于特定项目的属性。那么在将索引传递给“key”之前如何自定义索引？

这里是 API 的响应

[
  {
    "typeId": 2,
    "count": 410
  },
  {
    "typeId": 3,
    "count": 2
  },
  {
    "typeId": 4,
    "count": 19
  },
  {
    "typeId": 5,
    "count": 21
  },
  {
    "typeId": 6,
    "count": 1
  },
  {
    "typeId": 7,
    "count": 80
  }
   ...
]

数据利用

 <div className="top-error-ctn">
  <span className="heading">Top Errors</span>
  <p>
    Sorted By Type
  </p>
  <div className="row">
     {Sometest ? (
       all.slice(0, 6).map((all, index) => {
          return <ErrorBar key={index} all={all} />;
       })
     ) : (
       <span>Nothing to see</span>
     )}
  </div>
</div>

数据渲染

<div>
  <div className="side">
    <div>{all.typeId}</div>
  </div>
  <div className="middle">
    <div className="bar-container">
      <div className="bar-5"></div>
    </div>
  </div>
  <div className="side right">
    <div>{all.count}</div>
  </div>
</div>

Answer 1

您可以使用Array.prototype.sort()函数，如下所示。

const items = [
  {
    "typeId": 2,
    "count": 410
  },
  {
    "typeId": 3,
    "count": 2
  },
  {
    "typeId": 4,
    "count": 19
  },
  {
    "typeId": 5,
    "count": 21
  },
  {
    "typeId": 6,
    "count": 1
  },
  {
    "typeId": 7,
    "count": 80
  }
];
console.log('Sort by typeId:', items.sort((a, b) => a.typeId - b.typeId));

console.log('Sort by count:', items.sort((a, b) => a.count - b.count));