Home > Web Front-end > JS Tutorial > body text

Simple understanding of json

怪我咯
Release: 2017-04-01 09:47:06
Original
1619 people have browsed it

Json is jsobject.
-----
Simply put, JSON can convert a set of data represented in a JavaScript object into a string, which can then be used in Easily pass this string between functions, or pass a string from a Web client to a server-side program in an asynchronous application. This string looks a little weird (you'll see a few examples later), but JavaScript interprets it easily, and JSON can represent more complex structures than name/value pairs. For example, arrays and complex objects can be represented, rather than just simple lists of keys and values. Simple JSON example
In its simplest form, the following JSON can be used to represent name/value pairs:

{ "firstName": "Brett" }

This example Very basic, and actually takes up more space than the equivalent plain text name/value pair:
firstName=Brett

However, when stringing multiple name/value pairs together, JSON will reflect its value. First, you can create a record containing multiple name/value pairs, such as:

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" }

Syntax-wise, this isn't a huge advantage over name/value pairs, but in this case JSON is easier to use and more readable. For example, it makes it clear that the above three values ​​are part of the same record; the curly braces make the values ​​somehow related.
Array of values ​​
When it is necessary to represent a set of values, JSON can not only improve readability, but also reduce complexity. For example, suppose you want to represent a list of people's names. In
XML, many opening and closing tags are required; if you use typical name/value pairs (like the ones you saw in previous articles in this series), you must create a a proprietary data format, or modify the key name to something like person1-firstName. If using JSON, just group multiple records
with curly braces together:
{ "people": [

{ "firstName" : "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", " email": "jason@servlets.com" },

{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }

]}

This is not difficult to understand. In this example, there is only one
variable named people, and the value is an array containing three entries, each entry being a record for a person containing a first name, last name, and email address. The above example demonstrates how to use parentheses to combine records into a single value. Of course, you can use the same syntax to represent multiple values ​​(each containing multiple records):
{ "programmers": [

{ "firstName": "Brett", "lastName ":"McLaughlin", "email": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets .com" },

{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }

],

"authors": [

{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },

{ " firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },

{ "firstName": "Frank", "lastName": "Peretti", "genre" : "christian fiction" }

],

"musicians": [

{ "firstName": "Eric", "lastName": "Clapton", "instrument ": "guitar" },

{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }

]

}

The most noteworthy thing here is that it can represent multiple values, and each value in turn contains multiple values. However, it should also be noted that the actual name/value pairs in the record can differ between different main entries (programmers, authors, and musicians). JSON is fully dynamic, allowing the way data is represented to change in the middle of the JSON structure.
There are no predefined constraints that need to be adhered to when working with JSON-formatted data. Therefore, within the same data structure, the way the data is represented can be changed, and the same thing can even be represented in different ways.
Using JSON in JavaScript
Once you master the JSON format, using it in JavaScript is simple. JSON is a native JavaScript format, which means that processing JSON data in JavaScript does not require any special API or toolkit.
Assign JSON data to variables
For example, you can create a new JavaScript variable and then directly assign the JSON format data string to it:
var people =

{ "programmers ": [

{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },

{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" },

{ "firstName": "Elliotte", "lastName":"Harold", "email ": "elharo@macfaq.com" }

],

"authors": [

{ "firstName": "Isaac", "lastName": "Asimov ", "genre": "science fiction" },

{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },

{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }

],

"musicians": [

{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },

{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }

]

}
This is very simple; now people contains the data in the JSON format we saw earlier. However, this isn't enough as the way to access the data doesn't seem obvious yet.
Accessing data
Although it may not seem obvious, the long string above is actually just an array; you can easily access this array by placing it in a JavaScript variable. In fact, just use dot notation to represent array elements. So, to access the last name of the first entry in the programmers list, just use the following code in JavaScript:
people.programmers[0].lastName;

Note that the array Index is zero-based. So, this line of code first accesses the data in the people variable; then moves to the entry called programmers, then moves to the first record ([0]); and finally, accesses the value of the lastName key. The result is the string value "McLaughlin".
Here are a few examples using the same variable.
people.authors[1].genre // Value is "fantasy"
people.musicians[3].lastName // Undefined. This refers to the fourth entry,
and there isn't one
people.programmers.[2].firstName // Value is "Elliotte"

Using this syntax, any JSON format data can be processed without using any additional JavaScript toolkit or API.
Modify JSON data
Just as you can access the data using periods and brackets, you can also easily modify the data in the same way:

people.musicians[1].lastName = "Rachmaninov";

After converting the string into a JavaScript object, you can modify the data in the variable like this.
Convert back to string
Of course, all data modifications are of little value if the object cannot be easily converted back to the text format mentioned in this article. This conversion is also very simple in JavaScript:
String newJSONtext = people.toJSONString();
That’s it! You now have a text string that you can use anywhere, for example, as a request string in an Ajax application.
More importantly, any JavaScript object can be converted to JSON text. It is not only possible to handle variables originally assigned with JSON strings. To convert an object named myObject, simply execute a command of the same form:
String myObjectInJSON = myObject.toJSONString();
This is the biggest difference between JSON and the other data formats discussed in this series. If you use JSON, you only need to call a simple function to get the formatted data, which is ready to use. For other data formats, conversion between raw and formatted data is required. Even when using an API like the Document Object Model (which provides functions to convert your own data structures to text), you need to learn the API and use the API's objects instead of using native JavaScript objects and syntax.
The bottom line is that if you're dealing with a large number of JavaScript objects, JSON is almost certainly a good choice so that you can easily convert the data into a format that can be sent to the server-side program in the request.

Conclusion

This series has spent a lot of time discussing data formats, mainly because almost all asynchronous applications will eventually process data. You'll become more proficient in Ajax if you master the various tools and techniques for sending and receiving all types of data, and use them in a way that's best for each data type. On top of mastering XML and plain text, master JSON so that you can handle more complex data structures in JavaScript.

The next article in this series will look beyond sending data and provide an in-depth look at how server-side programs receive and process data in JSON format. Also discuss how server-side programs can send data back in JSON format across scripts and server-side components, allowing you to mix XML, plain text, and JSON requests and responses. This provides a lot of flexibility to use all of these tools in almost any combination.


The above is the detailed content of Simple understanding of json. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!