我使用AJAX获取了以下对象，并将它们存储在数组中：
var homes = [
{
"h_id": "3",
"city": "Dallas",
"state": "TX",
"zip": "75201",
"price": "162500"
}, {
"h_id": "4",
"city": "Bevery Hills",
"state": "CA",
"zip": "90210",
"price": "319250"
}, {
"h_id": "5",
"city": "New York",
"state": "NY",
"zip": "00010",
"price": "962500"
}
];
如何创建一个函数，仅使用JavaScript按price属性按升序或降序对对象进行排序？
当前回答
我推荐GitHub:ArraysortBy-使用Schwartzian变换的sortBy方法的最佳实现
但现在我们将尝试这种方法Gist:sortBy-old.js。让我们创建一个方法来对数组进行排序，以便能够按某种属性排列对象。
创建排序功能
var sortBy = (function () {
var toString = Object.prototype.toString,
// default parser function
parse = function (x) { return x; },
// gets the item to be sorted
getItem = function (x) {
var isObject = x != null && typeof x === "object";
var isProp = isObject && this.prop in x;
return this.parser(isProp ? x[this.prop] : x);
};
/**
* Sorts an array of elements.
*
* @param {Array} array: the collection to sort
* @param {Object} cfg: the configuration options
* @property {String} cfg.prop: property name (if it is an Array of objects)
* @property {Boolean} cfg.desc: determines whether the sort is descending
* @property {Function} cfg.parser: function to parse the items to expected type
* @return {Array}
*/
return function sortby (array, cfg) {
if (!(array instanceof Array && array.length)) return [];
if (toString.call(cfg) !== "[object Object]") cfg = {};
if (typeof cfg.parser !== "function") cfg.parser = parse;
cfg.desc = !!cfg.desc ? -1 : 1;
return array.sort(function (a, b) {
a = getItem.call(cfg, a);
b = getItem.call(cfg, b);
return cfg.desc * (a < b ? -1 : +(a > b));
});
};
}());
设置未排序的数据
var data = [
{date: "2011-11-14T16:30:43Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:22:59Z", quantity: 2, total: 90, tip: 0, type: "Tab"},
{date: "2011-11-14T16:28:54Z", quantity: 1, total: 300, tip: 200, type: "visa"},
{date: "2011-11-14T16:53:41Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:48:46Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:25:45Z", quantity: 2, total: 200, tip: 0, type: "cash"},
{date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa"},
{date: "2011-11-14T16:58:03Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:20:19Z", quantity: 2, total: 190, tip: 100, type: "tab"},
{date: "2011-11-01T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab"},
{date: "2011-11-14T17:07:21Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "Cash"}
];
使用它
按字符串形式的“日期”排列数组
// sort by @date (ascending)
sortBy(data, { prop: "date" });
// expected: first element
// { date: "2011-11-01T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab" }
// expected: last element
// { date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa"}
如果要忽略区分大小写，请设置解析器回调：
// sort by @type (ascending) IGNORING case-sensitive
sortBy(data, {
prop: "type",
parser: (t) => t.toUpperCase()
});
// expected: first element
// { date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "Cash" }
// expected: last element
// { date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa" }
如果要将“日期”字段转换为日期类型：
// sort by @date (descending) AS Date object
sortBy(data, {
prop: "date",
desc: true,
parser: (d) => new Date(d)
});
// expected: first element
// { date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa"}
// expected: last element
// { date: "2011-11-01T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab" }
在这里，您可以使用代码：jsbin.com/lesebi网站
由于@Ozesh的反馈，与具有虚假值的财产相关的问题得到了解决。
其他回答
我推荐GitHub:ArraysortBy-使用Schwartzian变换的sortBy方法的最佳实现
但现在我们将尝试这种方法Gist:sortBy-old.js。让我们创建一个方法来对数组进行排序，以便能够按某种属性排列对象。
创建排序功能
var sortBy = (function () {
var toString = Object.prototype.toString,
// default parser function
parse = function (x) { return x; },
// gets the item to be sorted
getItem = function (x) {
var isObject = x != null && typeof x === "object";
var isProp = isObject && this.prop in x;
return this.parser(isProp ? x[this.prop] : x);
};
/**
* Sorts an array of elements.
*
* @param {Array} array: the collection to sort
* @param {Object} cfg: the configuration options
* @property {String} cfg.prop: property name (if it is an Array of objects)
* @property {Boolean} cfg.desc: determines whether the sort is descending
* @property {Function} cfg.parser: function to parse the items to expected type
* @return {Array}
*/
return function sortby (array, cfg) {
if (!(array instanceof Array && array.length)) return [];
if (toString.call(cfg) !== "[object Object]") cfg = {};
if (typeof cfg.parser !== "function") cfg.parser = parse;
cfg.desc = !!cfg.desc ? -1 : 1;
return array.sort(function (a, b) {
a = getItem.call(cfg, a);
b = getItem.call(cfg, b);
return cfg.desc * (a < b ? -1 : +(a > b));
});
};
}());
设置未排序的数据
var data = [
{date: "2011-11-14T16:30:43Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:22:59Z", quantity: 2, total: 90, tip: 0, type: "Tab"},
{date: "2011-11-14T16:28:54Z", quantity: 1, total: 300, tip: 200, type: "visa"},
{date: "2011-11-14T16:53:41Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:48:46Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T17:25:45Z", quantity: 2, total: 200, tip: 0, type: "cash"},
{date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa"},
{date: "2011-11-14T16:58:03Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:20:19Z", quantity: 2, total: 190, tip: 100, type: "tab"},
{date: "2011-11-01T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab"},
{date: "2011-11-14T17:07:21Z", quantity: 2, total: 90, tip: 0, type: "tab"},
{date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "Cash"}
];
使用它
按字符串形式的“日期”排列数组
// sort by @date (ascending)
sortBy(data, { prop: "date" });
// expected: first element
// { date: "2011-11-01T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab" }
// expected: last element
// { date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa"}
如果要忽略区分大小写，请设置解析器回调：
// sort by @type (ascending) IGNORING case-sensitive
sortBy(data, {
prop: "type",
parser: (t) => t.toUpperCase()
});
// expected: first element
// { date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "Cash" }
// expected: last element
// { date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa" }
如果要将“日期”字段转换为日期类型：
// sort by @date (descending) AS Date object
sortBy(data, {
prop: "date",
desc: true,
parser: (d) => new Date(d)
});
// expected: first element
// { date: "2011-11-31T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "Visa"}
// expected: last element
// { date: "2011-11-01T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab" }
在这里，您可以使用代码：jsbin.com/lesebi网站
由于@Ozesh的反馈，与具有虚假值的财产相关的问题得到了解决。
更像LINQ的解决方案：
Array.prototype.orderBy = function (selector, desc = false) {
return [...this].sort((a, b) => {
a = selector(a);
b = selector(b);
if (a == b) return 0;
return (desc ? a > b : a < b) ? -1 : 1;
});
}
优势：
财产的自动补全扩展阵列原型不更改数组易于在方法链中使用
用法：
Array.prototype.orderBy=函数（选择器，desc=false）{return[…this].sort（（a，b）=>{a=选择器（a）；b=选择器（b）；如果（a==b）返回0；返回（desc？a>b:a<b）-1 : 1;});};var家=[{“h_id”：“3”，“城市”：“达拉斯”，“状态”：“TX”，“zip”：“75201”，“价格”：“162500”}, {“h_id”：“4”，“城市”：“贝弗利山”，“状态”：“CA”，“zip”：“90210”，“price”：“319250”}, {“h_id”：“5”，“城市”：“纽约”，“州”：“NY”，“zip”：“00010”，“价格”：“962500”}];let sorted_homes=homes.orderBy（h=>parseFloat（h.price））；console.log（“按价格排序”，sorted_homes）；let sorted_homes_desc=homes.orderBy（h=>h.city，true）；console.log（“按城市降序排序”，sorted_home_desc）；
要对其进行排序，需要创建一个接受两个参数的比较器函数。然后用比较器函数调用排序函数，如下所示：
// a and b are object elements of your array
function mycomparator(a,b) {
return parseInt(a.price, 10) - parseInt(b.price, 10);
}
homes.sort(mycomparator);
如果要按升序排序，请切换负号两边的表达式。
嗨，看完这篇文章后，我根据自己的需要制作了一个sortComprator，它具有比较多个json属性的功能，我想和大家分享一下。
此解决方案仅按升序比较字符串，但该解决方案可以方便地扩展到每个属性以支持：反向排序、其他数据类型、使用区域设置、强制转换等
var homes = [{
"h_id": "3",
"city": "Dallas",
"state": "TX",
"zip": "75201",
"price": "162500"
}, {
"h_id": "4",
"city": "Bevery Hills",
"state": "CA",
"zip": "90210",
"price": "319250"
}, {
"h_id": "5",
"city": "New York",
"state": "NY",
"zip": "00010",
"price": "962500"
}];
// comp = array of attributes to sort
// comp = ['attr1', 'attr2', 'attr3', ...]
function sortComparator(a, b, comp) {
// Compare the values of the first attribute
if (a[comp[0]] === b[comp[0]]) {
// if EQ proceed with the next attributes
if (comp.length > 1) {
return sortComparator(a, b, comp.slice(1));
} else {
// if no more attributes then return EQ
return 0;
}
} else {
// return less or great
return (a[comp[0]] < b[comp[0]] ? -1 : 1)
}
}
// Sort array homes
homes.sort(function(a, b) {
return sortComparator(a, b, ['state', 'city', 'zip']);
});
// display the array
homes.forEach(function(home) {
console.log(home.h_id, home.city, home.state, home.zip, home.price);
});
结果是
$ node sort
4 Bevery Hills CA 90210 319250
5 New York NY 00010 962500
3 Dallas TX 75201 162500
还有另一种
homes.sort(function(a, b) {
return sortComparator(a, b, ['city', 'zip']);
});
带有结果
$ node sort
4 Bevery Hills CA 90210 319250
3 Dallas TX 75201 162500
5 New York NY 00010 962500
如果您有符合ES6标准的浏览器，您可以使用：
箭头功能Number（）函数sort（）函数
升序和降序之间的区别是比较函数返回的值的符号：
var ascending = homes.sort((a, b) => Number(a.price) - Number(b.price));
var descending = homes.sort((a, b) => Number(b.price) - Number(a.price));
下面是一个工作代码片段：
var家=[{“h_id”：“3”，“城市”：“达拉斯”，“状态”：“TX”，“zip”：“75201”，“价格”：“162500”}, {“h_id”：“4”，“城市”：“贝弗利山”，“状态”：“CA”，“zip”：“90210”，“price”：“319250”}, {“h_id”：“5”，“城市”：“纽约”，“州”：“NY”，“zip”：“00010”，“价格”：“962500”}];homes.sort（（a，b）=>编号（a.price）-编号（b.price））；console.log（“升序”，homes）；homes.sort（（a，b）=>编号（b.price）-编号（a.price））；console.log（“下降”，homes）；
