按属性对对象数组进行排序

Sorting array of objects by property

本文关键字:排序 数组 对象 属性      更新时间:2023-09-26

我有这个来自数据库的集合:

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中是否有任何内置函数可以按属性对对象数组进行排序?

您可以使用orderBy过滤器。

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

查看

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

默认情况下,过滤器是升序(显式为+TypeId),您可以使用-TypeId使其降序。


附加资料

如果您想按多个属性排序,请使用数组,而不是像['TypeId', 'Name'] 那样使用string

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

当您在控制器内部进行手动过滤时,您可以获得很大的性能优势。其中,由于视图上的筛选较慢,因为它每次在摘要循环启动时都会评估ng-repeat express和绑定。通常情况下,在小集合中不会看到任何性能下降,但在较大的集合中,您会看到视图上的过滤工作速度较慢。

您可以使用js sort函数&ternary operator

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示例

您可以使用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>

在模板中:

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

在控制器/服务中:

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