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

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

Answer 1

您可以使用 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 表达式和绑定。通常，您不会在小型集合中看到任何性能下降，但在较大的集合中，您会发现在视图上进行过滤会很慢。

Answer 2

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

Answer 3

在模板中：

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

在controller/service中：

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

Answer 4

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

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

Sorting array of objects by property

javascript

angularjs

angularjs-filter

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

Sorting array of objects by property

javascript

angularjs

angularjs-filter

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