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

【问题标题】：Sorting array of objects by property按属性对对象数组进行排序
【发布时间】：2016-04-16 18:02:06
【问题描述】：

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

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

【问题讨论】：

你可以使用 Angular ng-repeat="items | orderBy: 'TypeId'"

标签： javascript angularjs angularjs-filter

【解决方案1】：

您可以使用orderBy 过滤器。

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

正在查看

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

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

其他内容

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

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

当您在控制器内部进行手动过滤时，您可以获得很大的性能优势。其中，视图过滤速度较慢，因为它在每次摘要循环触发时评估ng-repeat express 和绑定。通常，您不会在小型集合中看到任何性能下降，但在较大的集合中，您会发现视图过滤会很慢。

【讨论】：

你知道在视图和控制器之间是否存在性能差异吗？
@ivanivan 检查更新的答案，我为你添加了它:)

【解决方案2】：

在模板中：

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

在控制器/服务中：

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

【讨论】：

return a.TypeId - b.TypeId; 也可以！ ;)

【解决方案3】：

可以使用jssort函数&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

【讨论】：

【解决方案4】：

你可以使用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);

&lt;pre id="demo"&gt;&lt;/pre&gt;

【讨论】：