Sunday, July 14, 2019

JSON





  • JSON: JavaScript Object Notation.
  • JSON is a syntax for storing and exchanging data.
  • JSON is text, written with JavaScript object notationJSON


The JSON object, available in all modern browsers, has two very useful methods to deal with JSON-formatted content: parse and stringify. JSON.parse() takes a JSON string and transforms it into a JavaScript object. JSON.stringify() takes a JavaScript object and transforms it into a JSON string.


  1. When exchanging data between a browser and a server, the data can only be text.
  2. And we can convert any JavaScript object into JSON, and send JSON to the server.
  3. We can also convert any JSON received from the server into JavaScript objects.
  4. This way we can work with the data as JavaScript objects, with no complicated parsing and translations.

convert to JSON :-

const myObj = {
 name: 'Skip',
 age: 2,
 favoriteFood: 'Steak'
};
const myObjStr = JSON.stringify(myObj);
console.log(myObjStr);
// "{"name":"Skip","age":2,"favoriteFood":"Steak"}"
console.log(JSON.parse(myObjStr));
// Object {name:"Skip",age:2,favoriteFood:"Steak"}


Sending Data:-
If you have data stored in a JavaScript object, you can convert the object into JSON, and send it to a server:

var myObj = {name: "John", age: 31, city: "New York"};
var myJSON = JSON.stringify(myObj);
window.location = "demo_json.php?x=" + myJSON;

 Recieving Data:-

If you receive data in JSON format, you can convert it into a JavaScript object:

var myJSON = '{"name":"John", "age":31, "city":"New York"}';
var myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;
 Storing Data:-

When storing data, the data has to be a certain format, and regardless of where you choose to store it, the text is always one of the legal formats.
JSON makes it possible to store JavaScript objects as text.
// Storing data:
myObj = {name: "John", age: 31, city: "New York"};
myJSON = JSON.stringify(myObj);
localStorage.setItem("testJSON", myJSON);

// Retrieving data:
text = localStorage.getItem("testJSON");
obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.name;

Why use JSON?

Since the JSON format is text only, it can easily be sent to and from a server, and used as a data format by any programming language.

JavaScript has a built in function to convert a string, written in JSON format, into native JavaScript objects:

JSON.parse()

So, if you receive data from a server, in JSON format, you can use it like any other JavaScript object.


What is JSON?

JSON stands for JavaScript Object Notation
JSON is a lightweight data-interchange format
JSON is "self-describing" and easy to understand
JSON is language independent

JSON Values

In JSON, values must be one of the following data types:


  • a string
  • a number
  • an object (JSON object)
  • an array
  • a boolean
  • null


In JavaScript, values can be all of the above, plus any other valid JavaScript expression, including:

a function
a date
undefined

In JSON, string values must be

In jSON:- { "name":"John" }
In js  :- { name:'John' }


JSON Uses JavaScript Syntax

Because JSON syntax is derived from JavaScript object notation, very little extra software is needed to work with JSON within JavaScript.

With JavaScript you can create an object and assign data to it, like this:

var person = { name: "John", age: 31, city: "New York" };

The same way JavaScript objects can be used as JSON, JavaScript arrays can also be used as JSON.

JSON.Parse() 
A common use of JSON is to exchange data to/from a web server.
When receiving data from a web server, the data is always a string.
Parse the data with JSON.parse(), and the data becomes a JavaScript object.



JSON From the Server
You can request JSON from the server by using an AJAX request

As long as the response from the server is written in JSON format, you can parse the string into a JavaScript object.

EX:
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    var myObj = JSON.parse(this.responseText);
    document.getElementById("demo").innerHTML = myObj.name;
  }
};
xmlhttp.open("GET""json_demo.txt"true);
xmlhttp.send();



Parsing Dates

Date objects are not allowed in JSON.

If you need to include a date, write it as a string.

You can convert it back into a date object ter:


Parsing Functions

Functions are not allowed in JSON.

If you need to include a function, write it as a string.

You can convert it back into a function later:

JSON.Stringify()
A common use of JSON is to exchange data to/from a web server.

When sending data to a web server, the data has to be a string.

Convert a JavaScript object into a string with JSON.stringify()

JSON.OBJECT


JSON objects are surrounded by curly braces {}.

JSON objects are written in key/value pairs.

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.


myObj = "name":"John""age":30"car":null };
x = myObj.name;

Arrays as JSON objects


Arrays in JSON are almost the same as arrays in JavaScript.

In JSON, array values must be of type string, number, object, array, boolean or null.

In JavaScript, array values can be all of the above, plus any other valid JavaScript expression, including functions, dates, and undefined.

{
"name":"John",
"age":30,
"cars":[ "Ford""BMW""Fiat" ]
}

JSON PHP

A common use of JSON is to read data from a web server, and display the data in a web page.

This chapter will teach you how to exchange JSON data between the client and a PHP server.

PHP has some built-in functions to handle JSON.

Objects in PHP can be converted into JSON by using the PHP function json_encode():


No comments:

Post a Comment

Express

In this tutorial, we will also have a look at the express framework. This framework is built in such a way that it acts as a minimal an...