Table of contents
The difference between JSON object and JSON string
Here is a very common error report uncaught SyntaxError
How are JSON objects different from JavaScript objects
How to understand the relationship between JSON and JavaScript,
Yesterday, when manually encapsulating the jQuery library, I wanted to encapsulate Ajax into the jQuery library, and found that the JSON object and the js object were ambiguous, so hereby review and summarize the following knowledge points
What is JSON
-
JSON, the full name is JavaScript Object Notation, that is, JavaScript object notation.
-
JSON is a lightweight (Light-Meight), text-based (Text-Based), and human-readable (Human-Readable) format.
-
Although JavaScript is included in the name of JSON, this means that its syntax rules refer to JavaScript objects, not that it can only be used in the JavaScript language.
-
Because JSON itself is defined with reference to the rules of JavaScript objects, its syntax is almost identical to the syntax of JavaScript object definitions.
JSON is often used to transfer data between different languages, so it is only a form of expression, or format; for example, to transfer data between Java language and JavaScript, we can use JSON to achieve it (as for how to achieve it, read You will understand below...);
The difference between JSON object and JSON string
How to distinguish JSON object from JSON string? This problem troubles many beginners, how to distinguish it? We can use the essential distinction between the two:
- The essence of a JSON string is a string, that is, it is enclosed in double quotes or single quotes;
- However, the essence of a JSON object is an object. If it is an object, then the properties or methods of the object can be accessed through [object.property name] ;
It is possible to convert between the two , and the conversion method (using JavaScript's built-in object JSON):
- JSON.parse(jsonstring) ;//This method can convert JSON string jsonstring into JSON object;
- JSON.stringify(jsonobj) ;//This method can convert JSON objects into JSON strings;
Code demo:
Convert Json string to Json object ( JSON.parse() )
var str = '{"name":"shily","sex":"女","age":"23"}';
var strToObj = JSON.parse(str);
console.log(strToObj);
console.log(typeof strToObj);
console.log(strToObj.name)Convert Json object to Json string ( JSON.stringify() )
var obj = {"name":"shily","sex":"女","age":"23"}//json对象
var objToStr = JSON.stringify(obj);
console.log(objToStr);
console.log(typeof objToStr)Here is a very common error report uncaught SyntaxError
Go directly to the code: (You can think for yourself whether the following code will report an error? What is the reason for the error?)
let json = `{"name":"张三","age":undefined}`;
let obj = JSON.parse(json);The above code will report an error: the reason for the error is that the format of the JSON object is wrong, and JSON does not support undefined , which involves the common format of JSON objects, as follows:
How are JSON objects different from JavaScript objects
- The syntax is different: JavaScript objects are defined using curly braces { }, while JSON objects are defined using either curly braces { } or square brackets [ ].
- Attribute name quotes are different: JavaScript object attribute names can be enclosed in single quotes or double quotes without quotes, while JSON object attribute names must be enclosed in double quotes.
- Different data types: JavaScript objects can contain any type of data, including functions, dates, regular expressions, etc., while JSON objects only support simple data types, such as strings, numbers, Boolean values, arrays, and objects.
- The application scenarios are different: JavaScript objects are usually used for data structures inside programming languages, while JSON objects are usually used for data transmission and storage. When transmitting data over the network, JSON objects are often used for data exchange.
What is the difference between the JSON object creation format and the JavaScript object creation format
- The format for creating JSON objects is very similar to the format for creating JavaScript objects, with some minor differences:
- JSON objects must use double quotes around property names, while JavaScript objects can use double or single quotes.
- A property value of a JSON object can only be one of the following data types: string, number, boolean, null, array, or object. The property values of JavaScript objects can be of any data type, including functions and undefined.
- JSON objects cannot contain JavaScript-specific syntax such as functions, variables, expressions, etc., while JavaScript objects can contain these syntaxes.
For example, to create a JSON object:
{
"name": "Tom",
"age": 20,
"isStudent": true,
"hobbies": ["reading", "swimming"],
"address": {
"street": "123 Main St",
"city": "New York",
"state": "NY"
}
}Create a JavaScript object:
var person = {
name: 'Tom',
age: 20,
isStudent: true,
hobbies: ['reading', 'swimming'],
address: {
street: '123 Main St',
city: 'New York',
state: 'NY'
},
sayHello: function() {
console.log('Hello');
}
};How to understand the relationship between JSON and JavaScript,
Through the above understanding, we can draw the following conclusions:
It can be considered that the JSON object is a representation of the JS object. JSON is a text format used to transmit data across the web. In JavaScript, you can use JSON.parse to convert a JSON string to a JS object, and you can use JSON.stringify to convert a JS object to a JSON string. Therefore, JSON objects can be regarded as an extension of JS objects for representing and transferring data.
JSON syntax rules
The grammar rules of JSON are as follows:
- 1. The data is in key-value pairs, and the key-value pairs are separated by commas.
- 2. Curly braces {} save objects, which are used to save unordered key-value pairs.
- 3. Square brackets [] save the array, which is used to save an ordered list of elements.
- 4. The key name must be surrounded by double quotes, and the value can be a string, number, boolean, null, object or array.
- 5. Numbers can be integer or floating point.
- 6. Strings must be surrounded by double quotes.
- 7. Boolean values are represented by true and false.
- 8. Null represents an empty value.
- 9. The data format of JSON is strict, comments or redundant commas are not allowed.
Finally, a little stupid thing: Has anyone tested the following code in JavaScript?
var person={"name":"shily","sex":"女","age":"23"}
console.log(typeof person);Originally, I thought and expected the output to be JSON, but the actual output was indeed Object. The reason for this oolong was that I did not understand the data type of JavaScript. There is no object type JSON in JavaScript;
JSON object is essentially an object in JavaScript;