本文介绍了使用JavaScript对商品价格进行排序的两种方法。首先展示了如何直接在数据对象上使用`sort`方法结合自定义比较函数实现排序，然后解释了如何通过`reduce`方法进行价格升序排列。示例代码详细且清晰，最后给出了排序后的商品列表。
javascript-illustration.png
js通过两种方式进行对商品价格排序
export default {
data() {
return {
user: {
order_list: [
{ id: 1, title: "java", click: 300, price: 600 },
{ id: 2, title: "react", click: 240, price: 460 },
{ id: 3, title: "vue", click: 506, price: 820 },
{ id: 4, title: "c#", click: 157, price: 765 },
{ id: 5, title: "php", click: 650, price: 100 },
{ id: 6, title: "c语言", click: 80, price: 920 },
],
//方式二
userOrderSort() {
this.order_list.reduce((pre, cur) => {
return pre.price > cur.price ? 1 : -1;
}, []);
},
},
};
},
mounted() {
this.orderSort();
this.user.userOrderSort();
},
methods: {
//方式一
orderSort() {
this.user.order_list.sort(order("price"));
},
},
};
// 封装排序方法
function order(filed, type = "asc") {
return (a, b) => {
if (type == "asc") return a[filed] > b[filed] ? 1 : -1;
return a[filed] > b[filed] ? -1 : 1;
};
}
打印出来的结果
[
{
"id": 5,
"title": "php",
"click": 650,
"price": 100
},
{
"id": 2,
"title": "react",
"click": 240,
"price": 460
},
{
"id": 1,
"title": "java",
"click": 300,
"price": 600
},
{
"id": 4,
"title": "c#",
"click": 157,
"price": 765
},
{
"id": 3,
"title": "vue",
"click": 506,
"price": 820
},
{
"id": 6,
"title": "c语言",
"click": 80,
"price": 920
}
]
后期还会带来更多知识点，喜欢的点赞关注来点糖
扫一扫
9974
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
