Introduction to JSON (JavaScript object notation)


The JSON format was originally proposed by Douglas Crockford.

What is JSON?

The full name of json is JavaScript Object Notation, which is a lightweight data interaction format. It is based on a subset of ECMAScript (js specification formulated by the European Computer Association) and uses a text format completely independent of the programming language to store and represent data.

JSON uses JavaScript syntax, but the JSON format is plain text.

Text can be read and used as data by any programming language.

Why use JSON?

Because JSON format is just text, it can be easily transferred between server browsers and used as a data format for any programming language.

Allowed value types for JSON

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

character string
 number
 Object( JSON Object)
array
 Boolean
null

In JavaScript, the values listed above are all values, plus other valid JavaScript expressions, including:

function
 date
undefined

JSON file

The file type of json file is ". json"
The MIME type of JSON text is "application/json"

JSON syntax

JSON syntax rules

1. Strings in JSON must be enclosed in double quotes.

{ "name":"John" }

2. Numbers in JSON must be integers or floating point numbers.

{ "age":25 }

3. Values in JSON can be objects.

{
"employee":{ "name":"Bill Gates", "age":62, "city":"Seattle" }
}

4. Values in JSON can be arrays.

{
"employees":[ "Bill", "Steve", "David" ]
}

JSON.parse()

The general purpose of JSON is to transfer data with the web server.

When receiving data from a web server, the data is always a string.

Parse the data through JSON.parse(), and the data will become JavaScript objects.

Convert to JavaScript object

Use the JavaScript function JSON.parse() to convert text into JavaScript objects:

var text = '{"employees":[' +
'{"Name":"Zhang San","age":"20" },' +
'{"Name":"Li Si","age":"25" },' +
'{"Name":"Lao Wang","age":"30" }]}';

obj = JSON.parse(text);
console.log(obj);
console.log(obj.employees[0].Name)

Resolution date

Date objects are not allowed in JSON.

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

You can then convert it back to a date object:

var text = '{"name":"Zhang San", "birth":"2021-12-25", "city":"Xi'an"}';
var obj = JSON.parse(text);
obj.birth = new Date(obj.birth);
console.log('Zhang San's birthday is:',obj.birth)

analytic function

Functions are not allowed in JSON.

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

You can convert it back to the function later:

var text = '{"name":"Zhang San", "age":"function() {return 20;}", "city":"Xi'an"}';
var obj = JSON.parse(text);
obj.age = eval("(" + obj.age + ")");
console.log("Zhang San's age is:",obj.age());

Browser support

All major browsers and the latest ECMAScript (JavaScript) standard include the JSON.parse() function.

The numbers in the following table specify the first browser version that fully supports the JSON.parse() function:

JSON.stringify()

The general purpose of JSON is to exchange data with the web server.

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

Convert JavaScript objects to strings through JSON.stringify().

Stringing JavaScript objects

Use the JavaScript function JSON.stringify() to convert it to a string.

The result will be a string that follows the JSON notation.

var obj = { Name:"Zhang San",age:"20" };
var json = JSON.stringify(obj);
console.log(json)

Stringify JavaScript array

var arr = [ "Name","Zhang San","age","20" ];
var json = JSON.stringify(arr);
console.log(json)

Date stringing

Date objects are not allowed in JSON. The JSON.stringify() function converts any date to a string.

var obj = {  today: new Date()};
var json = JSON.stringify(obj);
console.log(json)

Function stringing

Functions are not allowed as object values in JSON.

The JSON.stringify() function removes any function from the JavaScript object, including keys and values:

var obj = { name: "Zhang San", age: function () {return 25;}, city: "Xi'an" };
var json = JSON.stringify(obj);
console.log(json)

Browser support

All major browsers and the latest ECMAScript (JavaScript) standard include the JSON.stringify() function.

The numbers in the following table specify the first browser version that fully supports the JSON.stringify() function:

reference resources: https://www.w3school.com.cn/js/js_json_parse.asp

Keywords: Javascript Front-end JSON

Added by nutt318 on Wed, 08 Dec 2021 21:14:30 +0200