JavaScript JSON Usage
Let's imagine that we have JavaScript data and we need to process this data on another page. Here we need to move data between pages in a certain format. In the past, plain text or XML was usually used for this. Since the XML format is difficult to interpret, a data format that is easier to interpret in JavaScript applications was produced. A new format called Javascript Object Notation has been developed.
JSON (JavaScript Object Notation) is a general format for representing values and objects. It is described in the RFC 4627 standard. It was originally made for JavaScript, but many other languages also have libraries that handle it.
Using JSON.stringify JSON.stringify: Used to convert JavaScript into JSON format. JSON.parse: Used to convert JSON objects to JavaScript.
JSON.stringify example;
var Person = {
name: 'Mehmet',
surname: 'Happy',
Age 38,
info: ['C#', 'CSS', 'PHP'],
site:"https:www.mutluweb.net.net"
};
var jsonKisi = JSON.stringify(Kisi);
alert(jsonPerson);
//json format
{
"name":"Mehmet",
"surname":"Happy",
"Age 38,
"info":["C#","CSS","PHP"],
"site":"https:www.mutluweb.net.net"
}
Example 2:
var Page = {
address: 'https://www.mutluweb.net.net/javascript/javascript-dersleri/',
logo: 'https://www.mutluweb.net.net/wp-content/uploads/2020/02/logox720.jpg',
category: 'JavaScript',
publishDate: 'Sun, 11 Feb 2020 15:07:43 +0000',
writer:'Mehmet'
};
var jsonPage = JSON.stringify(Page);
alert(jsonPage);
//json format
{
"address":"https://www.mutluweb.net/javascript/javascript-dersleri/",
"logo":"https://www.mutluweb.net/uploads/2020/02/logox720.jpg",
"category":"JavaScript",
"release date":
"Sun, 11 Feb 2020 15:07:43 +0000",
"author":"Mehmet"
}
The JSON.stringify method takes an object and converts it to a string of type string.The created string is JSON data ready to be sent. This data can be sent to another device for processing or to the database for saving.
You may have noticed that there is a slight difference between the JSON data and the JavaScript object. You need to pay attention to these differences to create correct json data.
JSON can also be applied to the following natural data types.
Object { … }
Array [ … ]
string,
number,
boolean :true/false,
null. For example:
// Number type
alert( JSON.stringify(1) ) // 1
// Data of type String
alert( JSON.stringify('test') ) // "test"
alert( JSON.stringify(true) ); //true
alert( JSON.stringify([1, 2, 3]) ); // [1,2,3]
JSON data is of cross reference reference type. That's why some JavaScript objects are not converted when converting with JSON.stringify.
Data excluded from conversion:
Object Methods.
Symbolic features
undefined
For example:
var Person = {
name:"Ahmet",
surname:"Gezer",
hobbies: undefined,
[Symbol("id")]: 75,
name surname() {
return this.name+ this.surname;
}
};
alert( JSON.stringify(Person) );
//Output
{
"name":"Ahmet",
"surname":"Gezer"
}
Using JSON.parse
The JSON.parse method is used to parse data created in JSON format and convert it into JavaScript format.
The structure converted from JSON format can be data, an array or an object. With the parse transformation, the structure becomes directly usable as a JavaScript object.
Ex:
var provinces='["Istanbul","Ankara","Izmir","Edirne"]';
var list = JSON.parse(countries);
alert(list); //Istanbul,Ankara,Izmir,Edirne
Ex 2:
var json='{"name":"Mehmet","surname":"Mutlu","age":41,"info":["C#","CSS","PHP"],"site":" https:www.mutluweb.net"}';
var data = JSON.parse(json);
// structure of the data object
{
name: 'Mehmet',
surname: 'Happy',
age 41,
info: ['C#', 'CSS', 'PHP'],
site:"https:www.mutluweb.net"
}
alert(data.site); //https:www.mutluweb..net