JavaScript JSON

JSON is a format used to store and transmit data.

JSON is usually used by the server to transfer data to the web page.

---

What is JSON?

• ##The full English name of JSON is JavaScript Object Notation

• JSON is a lightweight data exchange format.

• JSON is an independent language *

• JSON is easy to understand.

---

Tip: JSON uses JavaScript syntax, but the JSON format is just text.Text can be read by any programming language and passed as a data format.

---

The following JSON syntax defines the employees object: Array of 3 employee records (objects):

{"employees":[

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

---

JSON is formatted as a JavaScript object

The JSON format is syntactically identical to the code that creates JavaScript objects.

Because they are similar, JavaScript programs can easily convert JSON data into JavaScript objects.

---

#JSON syntax rules

• The data is key/value pairs.

• Data is separated by commas.

• Braces save the object

• Square brackets save the array

---

JSON data - one name corresponds to one value

JSON data format is key/value pairs, just like JavaScript object properties.

A key/value pair consists of the field name (in double quotes), followed by a colon, and then the value:

"firstName":"John"

---

JSON Object

JSON object is stored within curly brackets.

Just like in JavaScript, objects can hold multiple key/value pairs:

{"firstName":"John", "lastName":"Doe"}

---

JSON array

JSON array is stored in square brackets.

Just like in JavaScript, arrays can contain objects:

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

In the above example, the object "employees" is an array. Contains three objects.

Each object is a record of an employee (last name and first name).

---

Convert JSON string to JavaScript object

Usually we read JSON data from the server and display the data in the web page .

For the sake of simplicity, we set the JSON string directly in our web page

First, create a JavaScript string. The string is data in JSON format:

var text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName" :"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';

Then, use the JavaScript built-in function JSON. parse() converts a string into a JavaScript object:

var obj = JSON.parse(text);

Finally, use the new JavaScript object in your page:

Example

     
  
为 JSON 字符串创建对象
 
   

Run the program to try it

---

Related functions

Function	Description
JSON.parse()	Used to convert a JSON string into a JavaScript object.
JSON.stringify()	is used to convert JavaScript values to JSON strings.