One day Mickey was going down the street where he met Minnie
Mickey – Hey Minnie!
Minnie – Hi Mickey. How are you?
Mickey – I am good, what are you doing here?
Minnie – Ummm hmm… I came to …aaaa…. Get the groceries
Mickey – You look lost, what’s the matter?
Minnie – You see Mickey, I have been reading on JSON but do not get exactly what it is. I need to explain this in tomorrow’s class in simple words and with examples
Mickey – Oh, don’t you worry. I am here now
Minnie – Do you know about JSON
Mickey – Yes, of course, do you want to hear a story
Minnie (excited) – Yes
Mickey – Let’s go to the riverside restaurant then
Minnie – Awesome, let’s go
(At the restaurant)
Minnie – Let’s Start!
Mickey – Okay! Let’s say there are different countries and each has its own local language for communication
Minnie – Okay
Mickey – Now the people within the same country can communicate easily using their own language. But it will be difficult to interact with people from other countries
Minnie – That’s True!
Mickey – So what can be a solution here
Minnie – Well! they can keep an interpreter who understands the language of both countries and can help people to communicate
Mickey -Yes, but do you think that will be practical and manageable
Minnie – hmmm…
Mickey – Imagine, every person or every group will need to go with an interpreter whenever they need to communicate. And then one interpreter may understand 2 or a few languages but not all. So again there will be overhead to keep changing interpreters for communicating with different groups
Minnie – Yes, that sounds scary. I did not think of that
Mickey – Can there be a better and simpler option
Minnie (thinking) – hmmm..
Mickey – What if they all can agree and create a simple common language (like English) that all can understand and use to communicate with each other
Minnie – That would be good, but all of them will have to learn the new language
Mickey – Yes, I will talk more about that later. For now, just imagine that it will be a simple structural language that anyone can learn easily
Minnie – Yes that will be great
Mickey – So now take the same example of programming languages
We need a way so that different computer languages or applications built over different languages and platforms can communicate with each other
Minnie – So is JSON the common language here
Mickey – Yes,
JSON stands for JavaScript Object Notation
J Java
S Script
O Object
N Notation
Minnie – I get that
Mickey – JSON is an open standard lightweight data-interchange format that uses human-readable text to store and transmit data
Minnie – Okay
Mickey – It is basically a text format that makes it easy to share data between devices such as Clients and Servers
Minnie – Why the name “JavaScript Object Notation”. Has it to do anything with JavaScript language
Mickey – JSON uses the basic idea of javascript data structure. Its origin is based on how JavaScript objects work, so in that sense, it is related. Regardless of the fact that it has its origin from JavaScript, it is widely used across many Languages
Minnie – Alright!
Mickey – Now JSON is more like a structure or format
Minnie – What do you mean by that
Mickey – hmm… You can say it is not a complete language but the basic or grammar of a language
Minnie – Oh I see!
Mickey – So learning or understanding JSON is not like learning a completely new language, as we saw in our example of English
Minnie – So JSON is not a programming language
Mickey – Yes, it is not. It is a common and open standard format in which we can present our data or message and send over to other apps
Minnie – So is XML related to JSON
Mickey – XML is another way of communication. There can be more than one common language to communicate between people of different geographies and similarly, we have 2 formats XML and JSON to communicate between different programming languages or apps
Minnie – Okay so until now I have got this
- JSON stands for JavaScript Object Notation
- JSON is a syntax or format for storing and exchanging data
- JSON is language independent
- Platforms or applications built over different languages can exchange data or information using JSON
Mickey – Yes, well done!
Minnie – Okay Got it. So we now know that applications built over different languages can exchange data using JSON. But until now we have not discussed the actual format or structure of JSON
Mickey – Yes, now it’s time to go deep
Minnie – Wow, this is getting interesting
Mickey – Before that do you want to get some coffee and cookies
Minnie – Yeah, I believe I will need them
(Mickey orders coffee and cookies for Minnie)
Mickey – Okay now you will need a pen and paper
Minnie – Here you are
Mickey – Okay, now give me a list of Dogs with their breed, color, age, etc. Can you give me the data here?
Minnie – Sure
So here you go
Buddy, German Shepherd, Black, 10
Glory, Beagle, Brown, 5
Tyson, Pug, White, 7
Lakmi Poodle, Grey, 2
Mickey – Okay that is good. Now suppose this will be a data of 100 Dogs. Do you think it will be easy to read, manage, update, and search in the way you have created?
Minnie – That will be a mess
Mickey – Okay so now let me structure this data in JSON
{
"Dogs": [
{
"name": "Buddy",
"breed": "German Shephered",
"color": "Black",
"age": 10
},
{
"name": "Glory",
"breed": "Beagle",
"color": "Brown",
"age": 5
},
{
"name": "Tyson",
"breed": "Pug",
"color": "White",
"age": 7
},
{
"name": "Lakmi",
"breed": "Poodle",
"color": "Grey",
"age": 2
}
]
}
Minnie – Wow, this looks very formatted and easy to read
Is this JSON
Mickey – Yes! Exactly
Minnie – Wow
Mickey – Now, you see, it is easier to manage, update, and also to search anything both by humans and also by programming languages
Minnie – This is getting interesting. Tell me more…
Mickey – So here are some rules of JSON
- Data is in key/value pairs
- Data is separated by commas
- Curly braces hold objects
- Square brackets hold arrays
Minnie – So in the above examples we have an array of Dogs
Mickey – Yes! Right. Let’s understand more
A key/value pair consists of a field name or key (in double quotes), followed by a colon, followed by a value:
Example
“name” : “Buddy”
In JSON, keys must be strings, written with double quotes:
In JSON, values can be of type
- a string
- a number
- an object (JSON object)
- an array
- a boolean
- null
Minnie – Yes, now I can see that in the example
Mickey – Also you must have noticed all data is separated by a comma,
Minnie – yeah! I see that
Mickey – Now another rule says, Curly braces hold objects or we can say JSON objects are surrounded by curly braces {}
Minnie – So this is one object
{
“name”: “Buddy”,
“breed”: “German Shepherd”,
“color”: “Black”,
“age”: 10
}
Mickey – Yes! Absolutely correct. There can be nested objects i.e. objects within the object
And inside the objects
- Keys must be strings, and values must be a valid JSON data type (string, number, object, array, boolean or null).
- Keys and values are separated by a colon.
- Each key/value pair is separated by a comma.
Minnie – Yes I can see in the data
Mickey – You can also access the object values using dot(.) in programming
Example
dogObject1 = { “name” : “Buddy”, “breed” : “German Shepherd”, “color” : “Black”, “age” : 10 };
x = dogObject1.name;
OR using square brackets []
x = dogObject1[“name”];
Minnie – This is getting interesting and deep. I need more coffee
Mickey – Sure Minnie
Minnie – This is so refreshing. Let’s continue now
Mickey – Sure, Now coming to Arrays, we know Square brackets hold arrays OR we can say Arrays are surrounded by Square Brackets
Minnie – Yes I see in the Dogs array
Mickey – Okay so tell me, how can I access the 2nd dog’s detail from the Dogs array
Minnie – hmm don’t know
Mickey – Suppose you store the complete Dogs array in a variable say myDogs
Now you can say
x = myDogs.Dogs[1]
Minnie – But we needed the 2nd dog’s data, Why have you given 1 here
Mickey – That’s because the index position starts from 0 and not 1
Minnie – Got it. So this will give us
{
“name”: “Glory”,
“breed”: “Beagle”,
“color”: “Brown”,
“age”: 5
}
Mickey – Exactly
Minnie – I am getting this
Mickey – You can also parse or search any data inside a JSON using JSON Path
Minnie – What is JSON Path
Mickey – It is the location or address or a specific value or data in a JSON
You can create a JSON Path manually or use tools like JSON PathFinder – http://jsonpathfinder.com/
Minnie – Great!
Mickey – There is also a Chrome extension by the same name – JsonPath Finder
Minnie – I see!
Mickey – Okay, let’s do an activity
Minnie – Sure Mickey. I am excited!
Mickey – just copy the Dogs JSON and put it in here http://jsonpathfinder.com/
Then try to get JSON Path for the name of 3rd dog
Minnie – Okay
Mickey – On the right side expand the arrow to see your formatted data and then click on the value you want and JSON path will be displayed in the Path filed above
Minnie – Okay
Mickey – What did you get
Minnie – This
x.Dogs[2].name
Mickey – yes, so this is the JSON path to the name of 3rd dog object
Minnie – Great! This is interesting
Mickey – So you will find a lot of tools online for beautifying JSON, validating JSON and generating JSON path
Minnie – Wow!
Mickey – Also remember
- The file type or file extension for JSON files is “.json”
- The Media type for JSON text is “application/json”
Minnie – What is Media type
Mickey – Media type or MIME-type is a label used to identify a type of data
It is used so the software can know how to handle the data.
So when you send data, you also send its media type so that the server will know what type of data you are sending and can parse it accordingly
Minnie – Okay got it, that is why in HTML requests and API request I see this header content-type
Mickey – Exactly, that is to provide the type of data like “application/json” if the data is in JSON
Minnie – Many things getting clear here
Mickey – Happy to know that
Minnie – So, that means every programming language or application will have some function to parse a JSON data
Mickey – Minnie you are asking all right questions today. Exactly, you will find a function JSON.parse() in all languages that can communicate with JSON format
Minnie – I am got so much information today
Mickey – Remember JSON is like One universal language for communication between programming languages and applications
Minnie – Yes I will
Mickey – Should I drop you home now
Minnie – No, let’s order some more coffee and cake and enjoy the sunset
Mickey – How much coffee will you have today?
Minnie – Thanks for all this. I will never forget.
Mickey – I am always here for you 🙂