This is a collection of various snippets that relate to converting Objects to JSON format using the JSON.stringify(); method. We’ll look at ways to do this for an entire constant, but also learn how to specify the exact values we want to convert into JSON format.

Let’s start with the most basic example.

Convert Object format data into JSON

// The Object-based data we want to convert into JSON

const blog_data = [
  {
    "blog_title": "Title #1",
    "blog_category": {
      "blog_category1": "Category #1",
      "blog_category2": "Category #2"
    },
    "publish_date": "2022-07-25"
  },
  {
    "blog_title": "Title #2",
    "blog_category": "Category #1",
    "publish_date": "2022-06-24"
  },
  {
    "blog_title": "Title #3",
    "blog_category": "Category #2",
    "publish_date": "2022-05-23"
  }
];

// converting to JSON
let blog_data_json = JSON.stringify(blog_data);

We can then call blog_data_json with console.log and the output would be:

console.log(blog_data_json)

[{"blog_title":"Title #1","blog_category":{"blog_category1":"Category #1","blog_category2":"Category #2"},"publish_date":"2022-07-25"},{"blog_title":"Title #2","blog_category":"Category #1","publish_date":"2022-06-24"},{"blog_title":"Title #3","blog_category":"Category #2","publish_date":"2022-05-23"}]

The next step is to look at ways in which we can further customize the output. In particular, it is often useful to select a specific object(s) to convert into JSON.

Converting specific Objects into JSON format

By default, when you apply JSON.stringify to object data the entire set is going to get formatted into JSON. To select and convert specific Objects you can use an array. Here is an example:

const example_data = [
  {
    "name": "Alex",
    "surname": "Doe",
    "birthday": "1987-05-13"
  },
  {
    "name": "John",
    "surname": "Smith",
    "birthday": "1991-11-13"
  },
  {
    "name": "Will",
    "surname": "Khan",
    "birthday": "1967-10-25"
  },
];

let example_data_json = JSON.stringify(example_data, ['name', 'surname']);

And the output string is going to be:

console.log(example_data_json)

[{"name":"Alex","surname":"Doe"},{"name":"John","surname":"Smith"},{"name":"Will","surname":"Khan"}]

You can also do the same for nested objects, like so:

const nested_data = [
  {
    "name": "Alex",
    "surname": "Doe",
    "skills": {
      "css": "true",
      "javascript": "true",
      "rust": "false"
},
    "birthday": "1987-05-13"
  },
];

let nested_data_json = JSON.stringify(nested_data, ['name', 'skills', 'css', 'rust']);

And the output:

console.log(nested_data_json)

[{"name":"Alex","skills":{"css":"true","rust":"false"}}]

The important thing is to make sure you select the primary property wherein the nested data is stored. So, in this example, we have selected name, skills, and then two separate properties that we want to include in the final JSON string.

Changing value data during conversion to JSON format

And finally, let’s write a declaration to change the presentation of the birthday value. At the moment, we’re using a single dash - so let us replace it with a trailing / slash.

let bday_fix = (key, date) => {
        if (key === 'birthday') {
            return date.replace(/-/g, '/'); // replacing single with trailing
        }
        return date;
}

const demo_data = [
  {
    "name": "Blake",
    "surname": "Star",
    "birthday": "1970-12-17"
  },
];

// making sure that bday_fix is called alongside stringify
let demo_data_json = JSON.stringify(demo_data, bday_fix);

Converting JSON data to JavaScript Objects

In case you were wondering, the process can easily be reversed using the JSON.parse method.

const json_data_example = '{"name":"Alex","surname":"Doe"}';

let parse_json = JSON.parse(json_data_example);

console.log(parse_json.name);

Then you can use console.log to call either the entire string or to get specific properties.