Reading:

Getting start with JSON

Chapters

What is JSON?

JSON is text based, lightweight and language-independent data interchange format. It is derived from

ECMAScript Programming Language Standard. JSON contains a small set of formatting rules for portable representation of structured data.

JSON is known as JavaScript Object Notation.
The Douglas Crockford specified by formate.
It is designed for human-readable data interchange
The filename extension is .json
JSON Internet Media type is application/json

Uses of JSON

Useful while writing JavaScript based application which has websites and browser extension.
JSON format is used for transmitting & serializing structured data over network connection.
Transmission of data between web application and server.
It is used with most of programming languages.

JSON Example

Below is an data example for JSON

{
  "product": "Example JSON",
  "version": 3.1,
  "releaseDate": "2016-07-25T00:00:00.000Z",
  "demo": true,
  "person": {
    "id": 12345,
    "name": "John Doe",
    "phones": {
      "home": "800-123-4567",
      "mobile": "877-123-1234"
    },
    "email": [
      "jd@example.com",
      "jd@example.org"
    ],
    "dateOfBirth": "1980-01-02T00:00:00.000Z",
    "registered": true,
    "emergencyContacts": [
      {
        "name": "Jane Doe",
        "phone": "888-555-1212",
        "relationship": "spouse"
      },
      {
        "name": "Justin Doe",
        "phone": "877-123-1212",
        "relationship": "parent"
      }
    ]
  }
}

Above data can be represented in XML as shown below

<?xml version="1.0" encoding="UTF-8" ?>
<product>Example JSON</product>
<version>3.1</version>
<releaseDate>2016-07-25T00:00:00.000Z</releaseDate>
<demo>true</demo>
<person>
	<id>12345</id>
	<name>John Doe</name>
	<phones>
		<home>800-123-4567</home>
		<mobile>877-123-1234</mobile>
	</phones>
	<email>jd@example.com</email>
	<email>jd@example.org</email>
	<dateOfBirth>1980-01-02T00:00:00.000Z</dateOfBirth>
	<registered>true</registered>
	<emergencyContacts>
		<name>Jane Doe</name>
		<phone>888-555-1212</phone>
		<relationship>spouse</relationship>
	</emergencyContacts>
	<emergencyContacts>
		<name>Justin Doe</name>
		<phone>877-123-1212</phone>
		<relationship>parent</relationship>
	</emergencyContacts>
</person>

Let's quickly check how to make use of JSON data in your HTML/HTML5 files using JavaScript.

Step 1: Create a html file called json.html and save it in a preferred folder,

Step 2: Enter the source code below in that file

<html><head>
<title>JSON example</title>
<script language="javascript" >
  var tempObject = { "firstName" : "John", "lastName"  : "Doe" };
  document.write("<h1>JSON JavaScript Example</h1>");
  document.write("<br>");
  document.write("<h3>First Name = " + tempObject.firstName+"</h3>");  
  document.write("<h3>Last Name = " + tempObject.lastName+"</h3>");  
</script>
</head>
<body>
</body>
</html>

You will get something like this shown in your browser

JSON example

Moving on, in the next part we will know a bit more about JSON Syntax

Description

In this tutorial you will learn

What is JSON
Syntax
Datatypes with JSON
Objects
Schema
XML vs JSON
Using with PHP and Java

This tutorial is a quick walkthrough over the technology

Learning Objectives

Objective of this tutorial is to give you enough information on JSON to get you started with the technology

Author: Subject Coach
Added on: 20th Jul 2015

You must be logged in as Student to ask a Question.

None just yet!

Getting start with JSON

Chapters

What is JSON?

What is JSON?

Uses of JSON

JSON Example

Description

Learning Objectives

THANK YOU FOR STOPPING BY!