1. What is
the JSON.stringify method to convert an object into a JSON string form
const userInfo= {
name: 'zs',
age: 20
}
console.log(JSON.stringify(userInfo));
// {"name":"zs","age":20}
2. Syntax
Syntax: There can be three parameters, the first is to pass in the value to be serialized, the second is a function or array, and the third is to add indentation, spaces and newlines to the text
JSON.stringify(value[, replacer[, space]])
- value: the first parameter, the value to be serialized into a JSON string.
- replacer: [Optional] The second parameter
(1) If the parameter is a function, each attribute of the serialized value will be converted and processed by the function during the serialization process; (2) If the
parameter is an array, only convert the members of the array that have a key value. Members are converted in the same order as the keys are in the array.
(3) If the parameter is not provided or null, all properties of the object will be serialized. - space: [Optional] The third parameter, to beautify the text format, add indentation, spaces and line breaks to the text,
(1) If the parameter is a number, the return value text will be indented with the specified number of spaces at each level
( 2) The maximum value of this parameter is 10, if this parameter is greater than 10, the text will be indented by 10 spaces.
(3) This parameter can also use non-numbers, such as: \t. The maximum value is 10
3. Replacer usage
Parameter replacer: when it is a function
When the first case is a function, it has two parameters, key (key) and value (value), and both parameters will be serialized. We can filter some key values we want to operate through this function
- 序列化传入为对象时，若 replacer 函数返回 undefined 或者函数，则值会被忽略
// repalcer 接受两个参数 key value
function replacer(key, value) {
// key value 分别为对象的每个键值对
if (typeof value === "string") {
return undefined ;
}
return value;
}
const userInfo= {
name: 'zs',
age: 20,
sex: '男'
}
console.log(JSON.stringify(userInfo, replacer));
// {"age":20}
- 序列化传的是数组，若 replacer 函数返回 undefined ，当前值不会被忽略，而将会被 null 取代。
function replacer(key, value) {
// key value 分别为对象的每个键值对
if (typeof value === "string") {
return undefined ;
}
return value;
}
const foodList= ['苹果',1,'2',222]
console.log(JSON.stringify(foodList, replacer));
// [null,1,null,222]
Parameter replacer: when it is an array
then only convert the members of the array that have the key value
const userInfo= {
name: 'zs',
age: 20,
sex: '男'
}
console.log(JSON.stringify(userInfo, ['name','sex']));
//{"name":"zs","sex":"男"}
4. Precautions
- Wrapper objects of boolean values, numbers, and strings will be automatically converted to corresponding primitive values during serialization
JSON.stringify([new Number(1), new String("String"), new Boolean(true)]);
// [1,"String",true]
- If the converted value exists toJSON(), what value is returned by the toJSON() method, what value is returned by the serialization result, and the rest of the value will be automatically ignored
const userInfo= {
name: 'zs',
age: 20,
sex: '男',
toJSON(){
return '我是toJSON方法的返回值'
}
}
console.log(JSON.stringify(userInfo));
// "我是toJSON方法的返回值"
- When a Date object appears, JSON.stringify() will serialize the Date value into a time format string.
console.log(JSON.stringify(new Date()));
// '"2022-03-11T06:51:12.812Z"'
- JSON.stringify() can only serialize enumerable properties, non-enumerable properties will be automatically ignored by default
const userInfo= {
}
Object.defineProperty(userInfo, "work", {
content: '遛狗',
adrress: '广州',
enumerable: false
});
Object.defineProperty(userInfo, "time", {
value: '11.am',
enumerable: true
});
console.log(JSON.stringify(userInfo));
// {"time":"11.am"}
- If a Symbol value appears, it will be automatically ignored
const userInfo= {
name: 'zs',
[Symbol('ageSymbol')]: 'ageSymbol'
}
console.log(JSON.stringify(userInfo));
// {"name":"zs"}
…