Skip to Content

Advertisement

You (Level 0)
0% Complete
Last Badge Earned
None

In JavaScript, JSON stands for JavaScript Object Notion. Notion is simply the syntax of how something is written. Basically, we are dealing with JavaScripts objects, but we are using the idea of JSON. JavaScript gives JSON a few special functions, but we will get to these later. It should be said that, in JavaScript, we can have JSON objects and JSON arrays, but I will not be highlighting the difference in this tutorial as we will only work with objects. JSON arrays are just an array of JSON objects, so I don't really consider them to be much different that real arrays.

So, what is JSON and why should you care? You should care because JSON has revolutionized how to transfer information because of its simplicity and functionality. Sure, you can transfer data using XML, raw text, or some other structured data, but how easily is that integrated with JavaScript? Since it is JavaScript Object Notion, JSON is obviously integrated quite well with JavaScript. You can use JSON inside your code as a type of variable if you want, but it is most useful for requests made by AJAX. I won't dive into detail on how to transfer data using JSON with AJAX in this tutorial, but we will create a JSON object. Let's create some JSON:

Example var people = { "firstName":"Jared" , "lastName":"Drake" }
document.write(people.lastName);

This is a very simplistic example of JSON, which really is not that much different that creating another object in JavaScript. We create an object variable people that is set to this odd little string. The string is actually 2 separate variables or properties: "firstName" and "lastName". Yes, those variables or object properties are defined in quotes because that is how JSON is written. Following those properties, we have a colon and then what looks like another variable or property. Technically, it is a property of the preceding variable, but for our purposes think of it as a simple string. The same thing occurs for the next variable. That seems easy enough, but how does document.write(people.lastName); know to print out "Drake"? Like I said, people is an object with "firstName" and "lastName" as properties. So, when you tell JavaScript to write out people.lastName, it looks at the people object and sees that it does have a "lastName" property. Then, it prints out the contents of that property, which is "Drake".

I know that is a little difficult to wrap our heads around, but JSON is very useful for transferring data. Look at the structure of the example we created. We have just one ultimate variable name, that has ordered internal properties, which helps us reduce variable collisions or overwrites in our JavaScript.

References

I've attached my favorite JavaScript and jQuery book. I would encourage you to read it as well.

Your code will execute in this window.



Let's explore some more tutorials or topics!

Next Tutorial Previous Tutorial

Advertisement

If you enjoyed this resource, support me by sharing this page with others.

Comment on

Show Comments
  • User

    Fonebone April 10, 2015, 6:27 a.m.

    It's JavaScript Object Notation, btw.

  • User

    Charles Jones Jan. 7, 2014, 11:54 a.m.

    Thanks for the introduction to JSON! Great read!



Advertisement