- More secure
- Faster
- Stores a larger amount of data
- Stored data is not sent with every server request

Local storage is per domain. All pages from one domain can store and access the same data.

JSON

JavaScript Object Notation

JSON

JSON

JSON

JavaScript

JSON

JSON

to/from

application/json

JSON

.json

JSON

{}

[]

key/value

key

:

key/value

,

,

JSON

{
   "book": [

      {
         "id": "01",
         "language": "Java",
         "edition": "third",
         "author": "Herbert Schildt"
      },

      {
         "id": "07",
         "language": "C++",
         "edition": "second",
         "author": "E.Balagurusamy"
      }

   ]
}

string

{ "name":"John" }

float

{ "age":30.5 } 

integer

{ "age":30 } 

boolean

{ "sale":true }

array

{ "employees":[ "John", "Anna", "Peter" ] }

object

key:value

{ "employee":{ "name":"John", "age":30, "city":"New York" } } 

null

{ "middlename":null } 

,

[]

[

]

{
   "books": [
      { "language":"Java" , "edition":"second" },
      { "language":"C++" , "lastName":"fifth" },
      { "language":"C" , "lastName":"third" }
   ]
}

key/value

:

key/value

comma

key

strings

{}

{

}

{
   "id": "011A",
   "language": "JAVA",
   "price": 500,
}

- a function
- a date
- a symbol
- undefined

- Both JSON and XML are "self describing" (human readable)
- Both JSON and XML are hierarchical (values within values)
- Both JSON and XML are language independent
- Both JSON and XML can be parsed and used by lots of programming languages
- Both JSON and XML can be fetched with an XMLHttpRequest

+ JSON doesn't use end tag
+ JSON is shorter
+ JSON is quicker to read and write
+ JSON can use arrays
+ Better Performance
+ JSON can be parsed easily
+ JSON object has a type
+ All major JavaScript frameworks support JSON
+ Supported by all major JavaScript frameworks
+ Supported by most backend technologies
+ JSON is recognized natively by JavaScript (as object)
- JSON doesn't support comments
- JSON can not use attributes
- JSON offers poor extensibility as no namespace support
- Supports limited data types

{
   "company": Volkswagen,
   "name": "Vento",
   "price": 800000
}

<car>
   <company>Volkswagen</company>
   <name>Vento</name>
   <price>800000</price>
</car>

{
   "employees":[
      {"firstName":"John", "lastName":"Doe"},
      {"firstName":"Anna", "lastName":"Smith"},
      {"firstName":"Peter", "lastName":"Jones"}
   ]
}

<employees>
  <employee>
    <firstName>John</firstName> <lastName>Doe</lastName>
  </employee>
  <employee>
    <firstName>Anna</firstName> <lastName>Smith</lastName>
  </employee>
  <employee>
    <firstName>Peter</firstName> <lastName>Jones</lastName>
  </employee>
</employees>

$arr = array('a' => 1, 'b' => 2, 'c' => 3, 'd' => 4, 'e' => 5);

// Returns the JSON representation of a value (pretty printed)
echo json_encode($arr, JSON_PRETTY_PRINT);

{
    "a": 1,
    "b": 2,
    "c": 3,
    "d": 4,
    "e": 5
}

class Emp {
    public $name = "";
    public $hobbies  = [];
    public $birthdate = "";
}

$e = new Emp();
$e->name = "sachin";
$e->hobbies  = ["sport", "reading"];
$e->birthdate = date('Y-m-d', strtotime('2015-11-18'));

echo json_encode($e);

{"name":"sachin","hobbies":["sport","reading"],"birthdate":"2015-11-18"}

$json = '{"a":1,"b":2,"c":3,"d":4,"e":5}';

// Decoding into an object
var_dump(json_decode($json));

// Decoding into an array
var_dump(json_decode($json, true));

object(stdClass)#1 (5) {
  ["a"]=> int(1)
  ["b"]=> int(2)
  ["c"]=> int(3)
  ["d"]=> int(4)
  ["e"]=> int(5)
}
array(5) {
  ["a"]=> int(1)
  ["b"]=> int(2)
  ["c"]=> int(3)
  ["d"]=> int(4)
  ["e"]=> int(5)
}

JSON.parse()

let txt = '{"name":"John", "age":30, "city":"New York"}'

// Converts JSON string into a JavaScript object.
let obj = JSON.parse(txt);

// Puts the data into "p" element with id: demo
document.getElementById("demo").innerHTML = obj.name + ", " + obj.age;