解密JSON.stringify()的参数使用

基本使用

通常状况下,咱们使用JSON.stringify序列化对象,即将一个对象的属性和值转化为字符串javascript

let obj = { name:“ken” };
JSON.stringify(obj ); //{'name':'ken'}

第二个参数

实际上并非全部的JSON数据都能被序列化java

const secondItem = { 
  title: 'Transformers', 
  year: 2007, 
  starring: new Map([[0, 'Shia LaBeouf'],[1, 'Megan Fox']]) 
};

JSON.stringify(secondItem);
// {'title':'Transformers','year':2007,'starring':{}}

能够经过传递第二个参数来解决,首先来看下第二个参数的做用数组

JSON.stringify(secondItem, ['title']);
// { 'title':'Transformers' }

将一个数组传递到第二个参数中,以数组中的元素做为键值返回一个新的JSON对象函数

咱们也能够传递一个函数到第二个参数中this

JSON.stringify(secondItem, (key, value) => {
  if (value instanceof Set) {
    return [...value.values()];
  }
  return value;
});
// {'title':'Transformers','year':2007,'starring':['Shia LaBeouf','Megan Fox']}

传入的这个函数,接收两个值,即JSON对象中对应的键值对。经过这个方式能够解决上述的部分数据不能被序列化的问题code

第三个参数

JSON.stringify的第三个参数,用于控制序列比字符的间距(参数类型为数字,缩进的字符宽度)orm

JSON.stringify(secondItem, null, 2);
//{
//  "title": "Transformers",
//  "year": 2007,
//  "starring": {}
//}

若是传递的是一个字符串,就会用字符串的内容替换掉空白的字符对象

JSON.stringify(secondItem, null, '🦄');
//{
//🦄"title": "Transformers",
//🦄"year": 2007,
//🦄"starring": {}
//}

toJSON方法

自定义stringify返回的内容ip

const thirdItem = { 
  title: 'Transformers', 
  year: 2007, 
  starring: new Map([[0, 'Shia LaBeouf'],[1, 'Megan Fox']]),
  toJSON() {
    return { 
      name: `${this.title} (${this.year})`, 
      actors: [...this.starring.values()] 
    };
  }
};

console.log(JSON.stringify(thirdItem));
// {"name":"Transformers (2007)","actors":["Shia LaBeouf","Megan Fox"]}
相关文章
相关标签/搜索