js对象数组sort排序，可筛选置顶项

JavaScript实现对象数组排序与置顶功能

原创已于 2025-02-25 11:57:24 修改 · 854 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #开发语言 #ecmascript

于 2023-07-24 23:59:02 首次发布

JavaScript 专栏收录该内容

2 篇文章

订阅专栏

文章介绍了如何使用JavaScript的sort方法对包含特定属性的对象数组进行排序，包括基本的升序排序以及根据指定名称置顶单个或多个元素的方法。customSort和customSortArray函数分别实现了单个name值和nameList值的置顶操作。

最近遇到个需求：需要给对象数组进行排序，还需要置顶功能。

假设数据如下：

let data = [
  { value: 302, name: '家电' },
  { value: 300, name: '服装' },
  { value: 154, name: '食品' },
  { value: 211, name: '数码' },
  { value: 404, name: '家纺' }
];

一、对这个对象数组进行简单sort排序

console.log(
  data.sort(function (a, b) {
    return a.value - b.value;  // 按value值升序排列
 })
);

二、需求：传入一个置顶参数name，置顶name属性

function customSort(name) {
      data.sort(function (a, b) {
        if (a.name === name) {
          return -1;  // 将传入的name值置顶
        } else if (b.name === name) {
          return 1;   // 将传入的name值置顶
        } else {
          return a.value - b.value;  // 按value值升序排列
        }
      });
    }

三、需求：传入一个需要置顶参数列表nameList，置顶nameList中的所有项

//多项参数置顶
function customSortArray(nameList) {
  data.sort(function (a, b) {
    if (nameList.indexOf(a.name) >= 0) {
      return -1;  // 将传入的name值置顶
    } else if (nameList.indexOf(b.name) >= 0) {
      return 1;   // 将传入的name值置顶
    } else {
      return a.value - b.value;  // 按value值升序排列
    }
 });
}
customSortArray(['家电', '服装'])
console.log(data);

sort应用规则：