JSON Learning notes (i)

Source: Internet
Author: User

1. Introduction to JSON:

JSON: JAvaScript Object Notation (JavaScript object notation)

JSON is the syntax for storing and exchanging textual information. Similar to XML.

JSON is smaller, faster, and easier to parse than XML.

JSON instance
{"sites""name": "Huazhong University of Science and Technology", "URL": "www.hust.edu.cn" "name": "Google", "url": " www.google.com "" name ":" Weibo "," url ":" Www.weibo.com " }]}
1.1 What is JSON?
    • JSON refers to the JavaScript object notation (JAvaScript Object Notation)
    • JSON is a lightweight text data interchange Format
    • JSON is language Independent: JSON uses JavaScript syntax to describe data objects, but JSON is still independent of language and platform. The JSON parser and the JSON library support many different programming languages. Currently very much dynamic (php,jsp,. NET) programming language supports JSON.
    • JSON is self-descriptive and easier to understand
1.2 JSON-Convert to JavaScript object

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

Because of this similarity, the JavaScript program can use the built-in eval () function to generate native JavaScript objects with JSON data without a parser.

2. JSONGrammar

JSON syntax is a subset of JavaScript syntax.

2.1 JSON Syntax rules

JSON syntax is a subset of the JavaScript object notation syntax.

    • Data in name/value pairs

    • Data is separated by commas

    • Curly braces Save Object

    • Save array in brackets

2.2 JSON Name/value pairs

The writing format for JSON data is: name/value pairs.

Name/value pairs include the field name (in double quotation marks), followed by a colon, and then the value:

" name" : Huazhong University of Science and Technology " equivalent to this JavaScript statement:name = " Beginner's tutorial "

2.3 JSON Value

The JSON value can be:

    • Number (integer or floating point)
    • String (in double quotes)
    • Logical value (TRUE or FALSE)
    • Array (in brackets)
    • Object (in curly braces)
    • Null
2.4 JSON Numbers

The JSON number can be integer or float:{ "age": -

2.5 JSON Object

The JSON object is written in curly braces ({}):

An object can contain multiple name/value pairs:{ "name":"Huazhong University of Science" , "url":" www.hust.edu.cn" }

2.6 JSON Array

The JSON array is written in brackets:

An array can contain multiple objects

{"sites""name": "Huazhong University of Science and Technology", "URL": "www.hust.edu.cn" "name": "Google", "url": " www.google.com "" name ":" Weibo "," url ":" Www.weibo.com " }]}
2.7 JSON Boolean value

The JSON Boolean value can be True or false:{ "flag":true }

2.8 JSON NULL

JSON can set a null value:{ "root":null }

2.9 JSON using JavaScript syntax

JSON uses JavaScript syntax, so you can work with JSON in JavaScript without the need for additional software.

With JavaScript, you can create an array of objects and assign values like this:  

var sites = [    "name": "Huazhong University of Science", "url": "Www.hust.edu.cn" },     "name": "Google "," url ":" Www.google.com " },     " name ":" Weibo "," url ":" Www.weibo.com " }];

The first item in an array of JavaScript objects (the index starts at 0):

Sites[0].   Name; What's returned is: Huazhong University of Science and Technology

You can modify the data like this: sites[0]. Name="Tsinghua University ";

2.10 JSON File
    • The file type of the JSON file is ". JSON"
    • The MIME type of JSON text is "Application/json"

3JSON Object

Syntax Example:{ "name":"runoob", "alexa":10000, "site":null }

The JSON object is written using the curly braces ({}).

An object can contain multiple key/value (key/value) pairs.

Key must be a string, and value can be a valid JSON data type (string, number, object, array, Boolean, or null).

A colon (:) split is used in key and value.

Each key/value pair uses commas (,) to split.

3.1 Accessing object values

Use the dot number (.) To access the value of the object:

1<body>2 3<p> You can use the dot number (.) To access the value of the JSON object:</p>4 5<p id= "Demo" ></p>6 7<script>8 9       varmyObj, X;TenMYOBJ = {"Name": "Runoob", "Alexa": 10000, "Site":NULL }; Onex =Myobj.name; Adocument.getElementById ("Demo"). InnerHTML =x; -  -</script> the -</body>

Use the brackets ([]) to access the value of the object:

<p> You can also use brackets ([]) to access the value of the Josn object: </p><p id= "Demo" ></p><script>var= MYOBJ = {"Name": "Runoob", "Alexa": 10000, "site":null= myobj["name"];d Ocument.getelementbyid ( "Demo"). InnerHTML = x; </script>
3.2 Looping objects

  Use For-in to loop the properties of an object: 

1 var myObj = {"Name": "Runoob", "Alexa": 10000, "site":null  }; 2  for inch MYOBJ) {3     document.getElementById ("Demo"). InnerHTML + = x + "<br>"; 4 }

When you for-in the properties of a loop object, use the brackets ([]) to access the value of the property:

1 var myObj = {"Name": "Runoob", "Alexa": 10000, "site":null  }; 2  for inch MYOBJ) {3     document.getElementById ("Demo"). InnerHTML + = Myobj[x] + "<br>"; 4 }
3.3 Nested JSON objects

< Span class= "Hl-code" >json object can contain another JSON object: Span class= "hl-brackets" > < Span style= "font-size:16px" >

1 myObj = {2     "name": "Runoob",3     "Alexa": 10000,4      "Sites": {5         "site1": "www.hust.edu.cn",6         "Site2 ":" m.hust.edu.cn ",7         " Site3 ":" c.hust.edu.cn "8    }9  }

Use dot number (.) or the brackets ([]) to access the nested JSON object.  

x = myObj.sites.site1; // or x = myobj.sites["Site1"];
3.4 Modifying values
= "www.google.com"; use brackets ([]) to modify the value of the JSON object: myobj.sites["site1"] = "www.google.com";
3.5 Delete Object Properties
Delete keyword to remove the properties of the JSON object: Delete myObj.sites.site1; use brackets ([]) to remove the properties of the JSON object: Delete myobj.sites["site1"]
3.6 the difference between a JSON object and a JSON string:

JSON object

var str2 = { "name": "Asan", "Sex": "man" };

JSON string

var str1 = ' {' name ': ' Deyuyi ', ' sex ': ' Man '} ';

JSON Learning notes (i)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.