How To Master JSON stringify()

The JSON.stringify method takes a variable and transforms it into its JSON representation.

    const firstItem = { 
      title: 'Transformers', 
      year: 2007 
    };
    
    JSON.stringify(firstItem);
    // {'title':'Transformers','year':2007}
                

The problem comes when there is an element that can not serialize to JSON.

    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 has a second argument, which is called the replacer argument.

You can pass an array of strings that act as a whitelist for properties of the object to be included.

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

We can filter out values that we don't want to display. These values can be too large items (like an Error object) or something that doesn't have a readable JSON representation.

The replacer argument can also be a function. This function receives the actual key and value on which the JSON.stringify method is iterating. You can alter the representation of the value with the function's return value. If you don't return anything from this function or return undefined, that item will not be present in the result.

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

By returning undefined in the function, we can remove those items from the result.

    JSON.stringify(secondItem, (key, value) => {
      if (typeof value === 'string') {
        return undefined;
      }
      return value;
    });
    // {"year":2007,"starring":{}}
                

The third argument controls the spacing in the final string. If the argument is a number, each level in the stringification will be indented with this number of space characters.

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

If the third argument is a string, it will be used instead of the space character.

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

Read more here written by Gábor Soós.