
本文将介绍如何从 JSON 数据中移除特定的属性,例如 $id 和 $values,从而获得更清晰的数据结构。这在处理由后端序列化的数据时非常有用,特别是当这些属性对于前端展示或进一步处理没有实际意义时。
解决方案:递归清理 JSON 属性
核心思路是编写一个递归函数,遍历 JSON 对象的每一个属性,判断属性名是否为需要移除的属性(例如 $id),并进行相应的处理。如果属性值是对象或数组,则递归调用该函数进行进一步处理。
以下是 JavaScript 实现的 sanitizeJson 函数:
function sanitizeJson(obj) {
// 对象是数组?递归处理每个元素
if (Array.isArray(obj)) {
return obj.map(sanitizeJson);
}
// 对象是非 null 对象
else if (typeof obj === 'object' && obj !== null) {
// 同时存在 '$id' 和 '$values' 属性?处理 '$values' 属性
if (obj.hasOwnProperty('$id') && obj.hasOwnProperty('$values')) {
return sanitizeJson(obj['$values']);
}
// 从 '$id' 属性创建一个新对象,并处理剩余的属性
return Object.fromEntries(
Object.entries(obj)
.filter(([key]) => key !== '$id')
.map(([key, value]) => [key, sanitizeJson(value)])
);
}
return obj;
}代码解释:
- 数组处理: 如果输入 obj 是一个数组,则使用 map 方法对数组中的每个元素递归调用 sanitizeJson 函数。
-
对象处理: 如果 obj 是一个非 null 对象,则进行以下处理:
- $id 和 $values 同时存在: 如果对象同时拥有 $id 和 $values 属性,说明该对象是需要被简化的结构,直接递归处理 $values 属性的值,并将其返回。
- 其他对象: 使用 Object.entries 方法将对象转换为键值对数组,然后使用 filter 方法过滤掉 $id 属性,再使用 map 方法对剩余的键值对递归调用 sanitizeJson 函数,最后使用 Object.fromEntries 方法将键值对数组转换回对象。
- 其他类型: 如果 obj 不是数组或对象,则直接返回该值。
使用示例:
const json = '{"$id":"1","$values":[{"$id":"2","prop1":"result","prop2":"result","prop3":{"$id":"3","$values":[{"$id":"4","prop1":"result","prop2":null},{"$id":"4","prop1":"result","prop2":null}]}}]}';
const jsonObject = JSON.parse(json);
const result = JSON.stringify(sanitizeJson(jsonObject), null, '\t');
console.log(result);输出结果:
[
{
"prop1": "result",
"prop2": "result",
"prop3": [
{
"prop1": "result",
"prop2": null
},
{
"prop1": "result",
"prop2": null
}
]
}
]注意事项:
- 该函数会修改原始 JSON 对象的结构。如果需要保留原始数据,请先进行深拷贝。
- 该函数只移除了 $id 属性。如果需要移除其他属性,可以在 filter 方法中添加相应的判断条件。
- 此方法假设 $id 和 $values 总是成对出现,并且 $values 包含实际需要的数据。如果情况不同,需要调整代码逻辑。
总结:
通过使用 sanitizeJson 函数,可以有效地从 JSON 数据中移除 $id 和 $values 属性,从而获得更清晰、简洁的数据结构。这种方法适用于处理由后端序列化,并包含冗余属性的 JSON 数据,方便前端展示和进一步处理。根据实际需求,可以灵活修改该函数,以移除其他不需要的属性。










