二、JSON.stringify高阶用法
2.1 JSON.stringify第二个参数是一个数组
SON.stringify(obj,itemArr)有两个参数使用,过滤作用
export default {
data() {
return {
list: [
{ name: "张安", age: 34 },
{ name: "张强", age: 84 },
{ name: "张辉", age: 54 },
],
obj: { name: "安", age: 14 },
};
},
created() {
this.obj = { name: "安", age: 14, classs: "三年级二班", teacher: "张三" };
//JSON.stringify(obj,itemArr)有两个参数使用,过滤作用 obj是要序列化的对象,
itemArr是一个数组,包含 对应 obj的一个属性
const obj1 = JSON.stringify(this.obj, ["name", "teacher"]);
//此时我们打印的只有name,teacher这两个属性,相当于一个过滤属性
console.log(obj1); //{"name":"安","teacher":"张三"}
//如果第二个数组,没有匹配到值,就不会展示,比如下面的name1属性,在obj中没有,
所以就不会展示
const obj2 = JSON.stringify(this.obj, ["name", "name1"]);
console.log(obj2); //{"name":"安"}
},
mounted() {},
methods: {},
};
2.2 JSON.stringify第二个参数是一个方法
export default {
data() {
return {
list: [
{ name: "张安", age: 34 },
{ name: "张强", age: 84 },
{ name: "张辉", age: 54 },
],
obj: { name: "安", age: 14 },
};
},
created() {
this.list = [
{ name: "张安", age: 34 },
{ name: "张强", age: 84 },
{ name: "张辉", age: 54 },
];
//JSON.stringify(obj,itemArr)有两个参数使用,
//第二个参数是方法时候,注意方法不能用括号this.change()
const list1 = JSON.stringify(this.list, this.change);
console.log(list1);
//[{"name":"张安","age":"E"},{"name":"张强","age":"A"},{"name":"张辉","age":"B"}]
},
mounted() {},
methods: {
change(key, value) {
if (key === "age") {
if (value === 100) {
return "S";
} else if (value >= 80) {
return "A";
} else if (value >= 50) {
return "B";
} else {
return "E";
}
}
return value;
},
},
};
2.3 JSON.stringify 第三个参数–字符串缩进
JSON.stringify()方法的第三个参数控制缩进和空格。在这个参数是数值时,表示每一级缩进的空格数。例如,每级缩进4个空格,可以这样:
const list1 = JSON.stringify(this.list, this.change, 3);
如果直接写第三个参数,不写中间参数,则没有效果,不识别被忽略
const list1 = JSON.stringify(this.list, 3);
[{"name":"张安","age":34},{"name":"张强","age":84},{"name":"张辉","age":54}]
一文搞懂JSON.stringify和JSON.parse(一)JSON.stringify 和JSON.parse基础用法_前端小云儿的博客-CSDN博客