¿Por qué usar JSON.stringify() y JSON.parse()?


prefacio

A menudo vemos el uso de JSON.stringify() y JSON.parse() en proyectos, pero ¿por qué se usan? Cómo usarlos, este artículo los compartirá contigo.


1. ¿Por qué usar JSON.stringify()?

El método JSON.stringify() convierte un objeto o valor de JavaScript en una cadena JSON, y solo se pueden transmitir cadenas durante la transmisión de datos. Si los datos se transfieren directamente, se convertirán en [[Prototipo]]: no se puede usar el objeto

2. Comparación de si se usa o no JSON.stringify()

Cuando no esté en uso:

let abc = res.data.data.pages; //res是后端接口返回的数据,因为想要更好的说明情况在此处做了省略处理
console.log('后端返回的数据_abc:', abc);
sessionStorage.setItem('abc', abc);
sessionStorage.getItem('abc');
console.log('无JSON.stringify()_abc:', sessionStorage.getItem('abc'));

inserte la descripción de la imagen aquí
Después de usar JSON.stringify():

let abc = res.data.data.pages; //res是后端接口返回的数据,因为想要更好的说明情况在此处做了省略处理
let def = JSON.stringify(res.data.data.pages);
console.log('后端返回的数据_abc:', abc);
sessionStorage.setItem('def', def);
sessionStorage.getItem('def');
console.log('有JSON.stringify()_def:', sessionStorage.getItem('def'));

inserte la descripción de la imagen aquí
En este momento, el valor devuelto no será [[Prototype]]: Object, pero tendrá datos, pero seguirá siendo diferente del valor que obtuvimos originalmente del fondo. En este momento, JSON.parse() debe ser usado

3. Use JSON.parse() para analizar datos

let abc = res.data.data.pages; //res是后端接口返回的数据,因为想要更好的说明情况在此处做了省略处理
let def = JSON.stringify(res.data.data.pages);
console.log('后端返回的数据_abc:', abc);
sessionStorage.setItem('def', def);
sessionStorage.getItem('def');
//console.log('有JSON.stringify()_def:', sessionStorage.getItem('def'));
console.log('解析后的JSON.stringify()_def:', JSON.parse(sessionStorage.getItem('def')));

inserte la descripción de la imagen aquí
Los datos en este momento son los mismos que los devueltos por el backend, por lo que se pueden usar en otras páginas de componentes

por fin

Si compartir es útil para usted, ¡recuerde darle me gusta y alentarlo! ! !

Supongo que te gusta

Origin blog.csdn.net/daishu_shu/article/details/124383384
Recomendado
Clasificación