按属性排序对象数组

Question

我从数据库中得到了这个集合:

var items = [{ 'Name':'Michael', 'TypeId':1 }
        { 'Name':'Max', 'TypeId':1 }
        { 'Name':'Andre', 'TypeId':1 }
        { 'Name':'Georg', 'TypeId':2 }
        { 'Name':'Greg', 'TypeId':3 }
        { 'Name':'Mitchell', 'TypeId':2 }
        { 'Name':'Ptro', 'TypeId':1 }
        { 'Name':'Helga', 'TypeId':1 }
        { 'Name':'Seruin', 'TypeId':2 }
        { 'Name':'Ann', 'TypeId':3 }
        { 'Name':'Marta', 'TypeId':2 }]

我需要按TypeId递增的顺序对这些项目进行排序。

像这样:

var itemsSorted = [{ 'Name':'Michael', 'TypeId':1 }
        { 'Name':'Max', 'TypeId':1 }
        { 'Name':'Andre', 'TypeId':1 }
        { 'Name':'Ptro', 'TypeId':1 }
        { 'Name':'Helga', 'TypeId':1 }
        { 'Name':'Georg', 'TypeId':2 }
        { 'Name':'Mitchell', 'TypeId':2 }
        { 'Name':'Marta', 'TypeId':2 }]
        { 'Name':'Seruin', 'TypeId':2 }
        { 'Name':'Greg', 'TypeId':3 }
        { 'Name':'Ann', 'TypeId':3 }

JavaScript中是否有任何内置函数可以按属性对对象数组进行排序？

- Michael

---

你可以使用Angular的ng-repeat="items | orderBy: 'TypeId'"实现该功能。 - elclanrs

Answer 1

您可以使用orderBy过滤器。

var itemsSorted  = $filter('orderBy')(items, 'TypeId')

展出中

ng-repeat="item in items | orderBy: 'TypeId'"

默认情况下，过滤器按升序排列（显式的话将是+TypeId），您可以使用-TypeId来使其降序。

---

其他说明

如果想按多个属性排序，请使用数组而不是字符串，例如['TypeId', 'Name']。

ng-repeat="item in items | orderBy: ['TypeId', 'Name']"

在控制器内进行手动筛选会获得很大的性能优势，而在视图上筛选则较慢，因为它每次触发脏检查时都要评估ng-repeat表达式和绑定。通常，在小集合中您不会看到任何性能损失，但在大集合中，您将看到在视图上进行筛选的速度会变慢。

- Pankaj Parkar

---

你知道在视图中和在控制器中的性能是否有差别吗？ - ivanivan

@ivanivan，请检查更新的答案，我已经为您添加了它 :) - Pankaj Parkar

Answer 2

您可以使用JavaScript的sort函数和三元运算符

var items = [{ 'Name':'Michael', 'TypeId':1 },
            { 'Name':'Max', 'TypeId':1 },
            { 'Name':'Andre', 'TypeId':1 },
            { 'Name':'Georg', 'TypeId':2 },
            { 'Name':'Greg', 'TypeId':3 },
            { 'Name':'Mitchell', 'TypeId':2 },
            { 'Name':'Ptro', 'TypeId':1 },
            { 'Name':'Helga', 'TypeId':1 },
            { 'Name':'Seruin', 'TypeId':2 },
            { 'Name':'Ann', 'TypeId':3 },
            { 'Name':'Marta', 'TypeId':2 }]
    var sortedArray = items.sort(function(a,b){
     return a.TypeId >b.TypeId?1:a.TypeId <b.TypeId?-1:0
    })
    console.log(sortedArray);

JSFIDDLE Example

- brk

Answer 3

您可以使用 Array.prototype.sort 方法：

var items = [{ 'Name':'Michael', 'TypeId':1 },
        { 'Name':'Max', 'TypeId':1 },
        { 'Name':'Andre', 'TypeId':1 },
        { 'Name':'Georg', 'TypeId':2 },
        { 'Name':'Greg', 'TypeId':3 },
        { 'Name':'Mitchell', 'TypeId':2 },
        { 'Name':'Ptro', 'TypeId':1 },
        { 'Name':'Helga', 'TypeId':1 },
        { 'Name':'Seruin', 'TypeId':2 },
        { 'Name':'Ann', 'TypeId':3 },
        { 'Name':'Marta', 'TypeId':2 }];


items.sort(function(a, b) { return a.TypeId - b.TypeId; })

console.table(items);

document.getElementById('demo').innerHTML = JSON.stringify(items, null, 4);

<pre id="demo"></pre>

- Ori Drori

Answer 4

在模板中：

<li ng-repeat="item in items | orderBy:'TypeId'">...</li>

在控制器/服务中：

vm.sortedItems = $filter('orderBy')(items, 'TypeId');

- GG.

---

return a.TypeId - b.TypeId;同样也可以工作！ ;) - Rayon