Unterstreichen Sie Mixins
Wenn Sie die Antwort von @ emil_lundberg erweitern, können Sie auch ein "Mixin" schreiben, wenn Sie Underscore verwenden, um eine benutzerdefinierte Funktion zum Sortieren zu erstellen, wenn es sich um eine Art Sortieren handelt, die Sie möglicherweise irgendwo in einer Anwendung wiederholen.
Wenn Sie beispielsweise einen Controller haben oder Sortierergebnisse mit der Sortierreihenfolge "ASC" oder "DESC" anzeigen und zwischen diesen Sortierungen wechseln möchten, können Sie Folgendes tun:
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;
}
}
})
Anwendungsbeispiel
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');
})
Hier ist eine JSFiddle, die dies demonstriert: JSFiddle für SortBy Mixin