Detailed JSON and JSONP

JSON Introduction

1. What is JSON?

> JSON refers to JavaScript object notation (JAvaScript Object Notation)

> JSON is a lightweight data interchange format that is smaller, faster, and easier to parse than XML

> JSON Language-Independent text format

> JSON is easy to read and write, but also easy to machine parse and generate

JSON, originally from JavaScript, was later supported by all programming languages and became a common string data format.

2. Format of JSON string

2-1. A collection of "name/value" pairs, generally understood as objects . For example:

' {' UID ': 101, ' uname ': ' Roger ', ' ismarried ': true} '

2-2, an ordered list of values, generally understood as an array . For example:

' [10,20,true, ' Roger ', {},[]] '

The JSON format example is as follows:

Example one:

{"Web": [{"Name": "HTML5.0", "FullName": "Hypertext Markup Language"}, {"Name": "CSS3.0", "FullName": "Cascadi Ng StyleSheets "}, {" Name ":" JSON "," FullName ":" JavaScript Object Notation "}]}

{"Array": [1, 2, 3], "Boolean": true, "null": null, "number": 123, "Object": {"a": "B", "C": "D" }, "String": "Hello World"}

Example two:

<! Doctype html>
650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M01/8A/D1/wKioL1g8-FbwIvNdAAAUrxvze64168.png "title=" Qq20161129113843.png "alt=" Wkiol1g8-fbwivndaaaurxvze64168.png "/>

3. JSON has the following forms
3-1. The JSON string is either a {}or a []

650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M01/8A/D1/wKioL1g8-oTTOR8rAAAgNJhpkvc739.png "title=" Untitled.png "alt=" Wkiol1g8-ottor8raaagnjhpkvc739.png "/>
650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M02/8A/D5/wKiom1g8-pWTmcCTAAAaBiLpE2M063.png "title=" Untitled1.png "alt=" Wkiom1g8-pwtmcctaaaabilpe2m063.png "/>


3-2. All strings in JSON must use "", including key. Use a backslash to escape, such as: \ ", \ \, \b

650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M02/8A/D1/wKioL1g8-0XDimjOAACLGnu8jxc874.png "title=" Untitled3.png "alt=" Wkiol1g8-0xdimjoaaclgnu8jxc874.png "/>

3-3. The value of the JSON object can only be string, number, object, array, True, false, NULL, no Date , etc.
650) this.width=650; "src=" Http://s3.51cto.com/wyfs02/M02/8A/D1/wKioL1g8-rWxuzLrAAA28X_7d_s534.png "title=" Untitled2.png "alt=" Wkiol1g8-rwxuzlraaa28x_7d_s534.png "/>

4, JS and JSON Mutual transfer
JSON String = = JS Object/array: var obj = json.parse (str);
JS Object/Array = = JSON string: var str = json.stringify (obj);   

Example code one: (JSON to JS object)
var str = ' {' name ': ' Roger ', ' age ': ' + '; var obj = Json.parse (str); Console.log (obj);

Results:
650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M02/8A/D2/wKioL1g9DZvDtSlQAAAqSJYou2g033.png "title=" Qq20161129130927.png "alt=" Wkiol1g9dzvdtslqaaaqsjyou2g033.png "/>


Example code two: (JS to JSON string)
var jsobj = new Object (); jsobj.car = "BMW"; jsobj.color = "BLACK"; jsobj.price = 300,000;var Jsonstr = json.stringify (jsob j); Console.log (JSONSTR);

Results:
650) this.width=650; "src=" Http://s2.51cto.com/wyfs02/M01/8A/D6/wKiom1g9D3ayJIY3AAAapxGvn_4585.png "title=" Qq20161129131727.png "alt=" Wkiom1g9d3ayjiy3aaaapxgvn_4585.png "/>


5, PHP and JSON Mutual transfer
PHP array = JSON string:$str = Json_encode ($arr);
JSON string = = php Array: $arr = Json_decode ($STR);

Example code one: (PHP array to JSON string)
<?phpheader (' Content-type:application/json '); $arr = Array (' a ' + = ' apple ', ' b ' = ' banana ', ' c ' = ' cherry ', ' d ' = ' Duria '); $str = Json_encode ($arr); Echo ($STR);

Results:
650) this.width=650; "src=" Http://s1.51cto.com/wyfs02/M02/8A/D6/wKiom1g9EwSSGl8hAAAi7cJY6PI420.png "title=" Qq20161129133235.png "alt=" Wkiom1g9ewssgl8haaai7cjy6pi420.png "/>

Example code two: (JSON string to PHP array)
<?phpheader (' Content-type:application/json '); $str = ' {"A": "Apple", "B": "Banana", "C": "Cherry", "D": "Duria"} '; var _dump (Json_decode ($STR));

Results:
650) this.width=650; "src=" Http://s4.51cto.com/wyfs02/M02/8A/D6/wKiom1g9FGqzNFw_AAAp96_jlvc734.png "title=" Qq20161129133822.png "alt=" Wkiom1g9fgqznfw_aaap96_jlvc734.png "/>

JSONP Introduction

1. What is JSONP?
JSON with Padding : filled JSON, which is a "usage mode" of JSON, allows Web pages to retrieve data from other domain names (sites), that is, cross-domain reading .
This article is from the "Dapengtalk" blog, make sure to keep this source http://dapengtalk.blog.51cto.com/11549574/1877684
Detailed JSON and JSONP