我怎么能做一个asc和desc排序使用下划线

How can I do an asc and desc sort using underscore.js?

本文关键字:desc 排序 下划线 asc 一个 怎么能      更新时间:2023-09-26

我目前使用下划线排序我的json排序。现在我已经要求使用下划线进行ascendingdescending排序。我在文档中没有看到任何与此相关的内容。我怎样才能做到这一点呢?

您可以使用.sortBy,它将始终返回升序列表:

_.sortBy([2, 3, 1], function(num) {
    return num;
}); // [1, 2, 3]

但是你可以使用。reverse方法来获取降序:

var array = _.sortBy([2, 3, 1], function(num) {
    return num;
});
console.log(array); // [1, 2, 3]
console.log(array.reverse()); // [3, 2, 1]

或者当处理数字时,在返回值后面加一个负号来下移列表:

_.sortBy([-3, -2, 2, 3, 1, 0, -1], function(num) {
    return -num;
}); // [3, 2, 1, 0, -1, -2, -3]

在引擎盖下.sortBy使用内置的.sort([handler]):

// Default is alphanumeric ascending:
[2, 3, 1].sort(); // [1, 2, 3]
// But can be descending if you provide a sort handler:
[2, 3, 1].sort(function(a, b) {
    // a = current item in array
    // b = next item in array
    return b - a;
});

使用下划线按降序排列可以通过将返回值乘以-1来完成。

//Ascending Order:
_.sortBy([2, 3, 1], function(num){
    return num;
}); // [1, 2, 3]

//Descending Order:
_.sortBy([2, 3, 1], function(num){
    return num * -1;
}); // [3, 2, 1]

如果您按字符串而不是数字排序,您可以使用charCodeAt()方法来获取unicode值。

//Descending Order Strings:
_.sortBy(['a', 'b', 'c'], function(s){ 
    return s.charCodeAt() * -1;
});

Array原型的反向方法修改数组并返回对它的引用,这意味着您可以这样做:

var sortedAsc = _.sortBy(collection, 'propertyName');
var sortedDesc = _.sortBy(collection, 'propertyName').reverse();

同样,下划线文档为:

此外,数组原型的方法是通过链接的Underscore对象进行代理的,因此您可以将reversepush插入到您的链中,并继续修改数组。

这意味着你也可以使用.reverse()链接:

var sortedDescAndFiltered = _.chain(collection)
    .sortBy('propertyName')
    .reverse()
    .filter(_.property('isGood'))
    .value();

与Underscore库类似,还有一个名为'lodash'的库,它有一个方法"orderBy",该方法接受参数以确定排序的顺序。你可以用

_.orderBy('collection', 'propertyName', 'desc')

由于某些原因,没有在网站文档中记录。

强调mixin

扩展@emil_lundberg的答案,你也可以写一个"mixin",如果你使用下划线来创建一个自定义的排序函数,如果它是一种你可能在某个应用程序中重复的排序。

例如,也许你有一个控制器或视图排序结果排序顺序为"ASC"或"DESC",你想在排序之间切换,你可以这样做:

Mixin.js

_.mixin({
    sortByOrder: function(stooges, prop, order) {
      if (String(order) === "desc") {
          return _.sortBy(stooges, prop).reverse();
      } else if (String(order) === "asc") {
          return _.sortBy(stooges, prop);
      } else {
          return stooges;
      }
    }
})

var sort_order = "asc";
var stooges = [
  {name: 'moe', age: 40}, 
  {name: 'larry', age: 50}, 
  {name: 'curly', age: 60},
  {name: 'July', age: 35},
  {name: 'mel', age: 38}
 ];
_.mixin({
    sortByOrder: function(stooges, prop, order) {
    if (String(order) === "desc") {
        return _.sortBy(stooges, prop).reverse();
    } else if (String(order) === "asc") {
        return _.sortBy(stooges, prop);
    } else {
        return stooges;
    }
  }
})

// find elements
var banner = $("#banner-message");
var sort_name_btn = $("button.sort-name");
var sort_age_btn = $("button.sort-age");
function showSortedResults(results, sort_order, prop) {
    banner.empty();
    banner.append("<p>Sorting: " + prop + ', ' + sort_order + "</p><hr>")
  _.each(results, function(r) {
    banner.append('<li>' + r.name + ' is '+ r.age + ' years old.</li>');
  }) 
}
// handle click and add class
sort_name_btn.on("click", function() {
  sort_order = (sort_order === "asc") ? "desc" : "asc"; 
    var sortedResults = _.sortByOrder(stooges, 'name', sort_order);
  showSortedResults(sortedResults, sort_order, 'name');
})
sort_age_btn.on('click', function() {
    sort_order = (sort_order === "asc") ? "desc" : "asc"; 
    var sortedResults = _.sortByOrder(stooges, 'age', sort_order);
  showSortedResults(sortedResults, sort_order, 'age');
})
JSFiddle for SortBy Mixin

您可以在第一次迭代中使用相反的顺序:

_.sortBy([2, 3, 1], num => -num )