JS根据json数组多个字段排序及json数组常用操作

JSON数组是前端开发中常用的数据类型，掌握对JSON数组的操作是前端开发的必要技能之一。本文将详细讲解如何在JS中根据JSON数组中的多个字段进行排序，并介绍JSON数组常用的操作方法。

一、JSON数组排序

1.1 单字段排序

对于只有一个字段需要排序的JSON数组，可以使用Array.prototype.sort()方法来进行排序。

示例：

let arr = [
    {name: 'Tom', age: 22},
    {name: 'Jack', age: 30},
    {name: 'Lucy', age: 18}
];
arr.sort((a, b) => a.age - b.age);   // 按照年龄升序排序
console.log(arr);

输出结果：

[
    {name: 'Lucy', age: 18},
    {name: 'Tom', age: 22},
    {name: 'Jack', age: 30},
]

1.2 多字段排序

对于需要按照多个字段进行排序的JSON数组，可以使用Array.prototype.sort()方法结合ES6的解构赋值来进行排序。

示例：

let arr = [
    {name: 'Tom', age: 22, score: 90},
    {name: 'Jack', age: 30, score: 85},
    {name: 'Lucy', age: 18, score: 95}
];
arr.sort((a, b) => {
    if (a.age !== b.age) {  // 按照年龄升序排列
        return a.age - b.age;
    } else {   // 年龄相同时，按照成绩降序排列
        return b.score - a.score;
    }
});
console.log(arr);

输出结果：

[
    {name: 'Lucy', age: 18, score: 95},
    {name: 'Tom', age: 22, score: 90},
    {name: 'Jack', age: 30, score: 85},
]

二、JSON数组常用操作

除了排序，JSON数组还有很多其他常用的操作方法。

2.1 过滤数据

使用Array.prototype.filter()方法可以对JSON数组中的数据进行过滤，只保留符合条件的数据。

示例：

let arr = [
    {name: 'Tom', age: 22},
    {name: 'Jack', age: 30},
    {name: 'Lucy', age: 18}
];
const ret = arr.filter(item => item.age >= 22);
console.log(ret);

输出结果：

[
    {name: 'Tom', age: 22},
    {name: 'Jack', age: 30},
]

2.2 提取数据

使用Array.prototype.map()方法可以对JSON数组中的数据进行处理，提取出需要的数据。

示例：

let arr = [
    {name: 'Tom', age: 22},
    {name: 'Jack', age: 30},
    {name: 'Lucy', age: 18}
];
const ret = arr.map(item => item.name);
console.log(ret);

输出结果：

['Tom', 'Jack', 'Lucy']

2.3 数据去重

使用Set对象可以对JSON数组中的数据进行去重。

示例：

let arr = ['Tom', 'Jack', 'Lucy', 'Tom'];
const ret = [...new Set(arr)];
console.log(ret);

输出结果：

['Tom', 'Jack', 'Lucy']

总结

以上就是JS根据JSON数组多个字段排序及JSON数组常用操作的攻略，在实际的前端开发中，这些操作非常常见，掌握后将会提高开发效率。