JSON introduction in Ajax – Tutorial 6

In Ajax, we used JSON. What is JSON. Know it’s basics.

In old days, we used XML to store the data and we get response in terms of XML.

parsing XML is not easy and tedious process.

In modern days we use JSON to store the data. So almost all web APIs gives us the JSON data when we call those.

Parsing JSON is easy and converting JSON data to variable in different languages like PHP, Java etc is straight forward method.

How JSON looks like: [{data}, {data}]

To validate your JSON you can use https://jsonlint.com

some dummy JSON format is on: https://jsonplaceholder.typicode.com/users

Do you remember how JavaScript object looks like? JSON is more like JS object or array of JS object.

This is JavaScript object.

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

And this is the Valid JSON string: Note that everything is in a comma, and Keys & values strings are in a comma which is not in the case of a JS object. Js object has key values not in commas.

{
	"name": "Dilip",
	"age": 38,
	"address": "Mahadev Avenue, Vastral",
	"job": "Software Dev",
	"salary": "20 Lac"
}

OR

[
  {
    "userId": 1,
    "id": 1,
    "title": "quidem molestiae enim"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "sunt qui excepturi placeat culpa"
  }
]

When we compare JSON with JavaScript object you can see the difference here. The property name in JS object is variable like name, age, address so we can call it like objectname.variable.

{name: 'Dilip', age: 38, address: 'Mahadev Avenue, Vastral', job: 'Software Dev', salary: '20 Lac'}

While in JSON, it’s all in string format.

JSON is only used to store the data so it can’t call a function in data but JavaScript object can take a function as data. So JavaScript object is more advance then JSON.

Next lession