JSON Data, format, mime type and parsing

JSON stands for JavaScript Object Notation. It is lightweight because it does not contain mark up. Any programming language can use this notation, so it is language independent. Its syntax is easy to learn. It is based on JavaScript Object notation syntax. Any language can read and generate JSON format data.

JSON is a format for representing, exchanging and storing data in the form of text. It is mainly used to send data from server to a web client using an AJAX request. When a web server returns JSON formatted data thru HTTP, it uses a mime type:

Content-Type: application/json

JSON Data Example

Below object defines an object containing a ‘students’ object which is an array of students data:

{
 "students":[
 {"name":"Srinivas", "standard":"first", "grade" : "A", "Age":11, "InState":false},
 {"name":"Anna", "standard":"second", "grade" : "C", "Age":10, "InState":true},
 {"name":"Peter", "standard":"third", "grade" : "B", "Age":12, "InState":null}
 ]
}

Syntax

• Curly bracket is used for objects.
• Square bracket is used for array.
• Data in in name/value pair where name is the name of the member and value is the value of the member
• Name must be surrounded by double quotes  (RFC 7159).
• Values of type = string must be surrounded by double quotes. Numbers and literals such as true, false, null need not be quoted.
• Each name/value pair data is separated by comma.

A name/value pair

Member (property) of an object or array is a name/value pairs. It is exactly like JavaScript Object properties. Names are surrounded by double quotes and are followed by a colon(:) then followed by a value.

Value can be

• strings (must be surround by double quotes. Ex:  “David”)
• numbers (no need to surround with double quotes. Ex: 22,  -88, -4.7e-22)
• literals (only true, false, null are allowed and no need to surround with double quotes)

JSON Objects

Objects are enclose within curly braces. There can be more than one name/value pair in an Object.

JSON Arrays

Same as JSON Objects, an array is enclosed within square brackets. There can be more than one array in an Object. An array can contain another Object.

{
 "students":[
 {"name":"Srinivas", "standard":"first", "grade" : "A", "Age":11, "InState":false},
 {"name":"Anna", "standard":"second", "grade" : "C", "Age":10, "InState":true},
 {"name":"Peter", "standard":"third", "grade" : "B", "Age":12, "InState":null}
 ]
}

In above example, students is an Object. It has three other objects within it.

JSON Numbers

JSON numbers can be negative/positive and represent simple integers (example: 20, 545, -66), fractions with decimal point (2.3, -8,88) ,  numbers or exponential notated numbers such as -2.3e-35

JSON Strings

JSON strings are by default UTF-8 strings surrounded by double quotes (Example: “hello”, “John”, “New York, NY, USA”).  Other UTF formats such as UTF-16 and UTF-32 can be used inside quotations, but may not be compatible with all JSON parsers.

JSON Comments

JSON does not support comments. However, you can create dummy property called

“__comment”=”My comment”

And parse it in your client to extract the comment. Checkout stackoverflow answer for this.

JSON Generators

In JavaScript, there is a built in class called JSON. The member function JSON.stringify(Object) is a JSON generator, which will return the JSON string for Object.

var Obj= {"Name":"Srinivas"};
var json_str = JSON.stringify(Obj); // json_str = '{"Name":"Srinivas"}'

JSON Parsers

A JSON Parser converts JSON string into a JavaScript Object. Parser is the counterpart of the JSON generator.

A JSON parser MUST accept all texts that conform to the JSON grammar. An implementation may set limits on the size of texts that it accepts. An implementation may set limits on the maximum depth of nesting. An implementation may set limits on the range and precision of numbers. An implementation may set limits on the length and character contents of strings. In JavaScript, there is a built in class called JSON. The member function JSON.parse() is a JSON parser.

Lets assume we have an object of students.

{
 "students":[
 {"name":"Srinivas", "standard":"first", "grade" : "A", "Age":11, "InState":false},
 {"name":"Anna", "standard":"second", "grade" : "C", "Age":10, "InState":true},
 {"name":"Peter", "standard":"third", "grade" : "B", "Age":12, "InState":null}
 ]
}

We can use this JavaScript built-in function, JSON.parse() to convert JSON string a JavaScript Object.

var studentsObj = JSON.parse(students);

New variable studentsObj is use in JavaScript code.

<!DOCTYPE html>
<html>
<body>

Student Name : 
<p id="demo"></p>
<script>


var students= `{
    "students":[
        {"name":"Srinivas", "standard":"first",  "grade" : "A", "Age":11, "InState":false},
        {"name":"Anna", "standard":"second", "grade" : "C", "Age":10, "InState":true},
        {"name":"Peter", "standard":"third", "grade" : "B", "Age":12, "InState":null}
    ]
}`;
var studentObj = JSON.parse(students);
console.log(studentObj);
document.getElementById('demo').innerHTML = 
    "Name: " + studentObj.students[0].name + "<br>In State Status: " + (studentObj.students[0].InState?" Resident":" Non Resident");

</script>

</body>
</html>

Download the code Run the code

Security Considerations

There are always security issues with any scripting language. JSON is a subset of JavaScript but excludes assignment and invocation. Since JSON’s syntax is borrowed from JavaScript, it is possible to use JavaScript eval() function to parse JSON texts. This can be a security risk, since the text could contain executable code along with data declarations.

<<< JavaScript PerformanceJavaScript Form Validation >>>