JSON: Make data transmission more elegant

Under the sunshine on the beaches of Southeast Asia, sometimes there are some charming commodities such as shells and handicrafts that attract you. However, the language barrier can sometimes be a hindrance to purchasing goods. Had to use hand gestures and try various methods to communicate. Fortunately, people have found a primitive communication technique, a mutually acceptable way of exchanging information: drawing numbers with their feet in the sand.

picture

Merchants carefully map the prices of goods on the beach, and tourists observe carefully and express their wishes graphically. If the merchant agrees, he will nod or use gestures to express his acceptance; if he disagrees, he will erase the number drawn and use a new number to represent his psychological price. After several rounds of interaction, the two parties gradually approached a consensus on the price, and finally reached a deal, which was both fun and efficient.

picture

In programming, in order to ensure that the two parties can transmit information smoothly, it is necessary to agree on a method of information exchange. Among them, JSON, as a lightweight, easy-to-read and write data format, is like drawing numbers on the beach, and has become a tacit way for front-end and back-end information interaction. Through the agreed JSON data structure, the requesting and responding parties can exchange information more efficiently and realize the seamless transmission of information.

JSON, then, is a data format used for information exchange.

Common Data Interaction Formats

Common data interaction formats include different structures such as plain text, XML, and JSON. Let's take a look at the differences between them.

1. Plain text format

    ● Separated by vertical bars (name|gender|address|age|mobile phone number)

张三|男|沙阳路18号北京科技职业学院内|23|13333335555
婉儿|女|大连设计城901|22|13333336666

    ● comma-separated (name, gender, address, age, mobile phone number)

张三,男,沙阳路18号北京科技职业学院内,23,13333335555
婉儿,女,大连设计城901,22,13333336666

2. XML format

<students>
    <student>
        <name>张三</name>
        <gender>张三</gender>
        <addr>沙阳路18号北京科技职业学院内</addr>
        <age>23</age>
        <phone>13333335555</phone>
    </student>
    <student>
        <name>张三</name>
        <gender>张三</gender>
        <addr>沙阳路18号北京科技职业学院内</addr>
        <age>23</age>
        <phone>13333335555</phone>
    </student>
</students>

3. JSON format

{
    "students": [
        {
            "name": "张三",
            "gender": "张三",
            "addr": "沙阳路18号北京科技职业学院内",
            "age": 23,
            "phone": "13333335555"
        },
        {
            "name": "张三",
            "gender": "张三",
            "addr": "沙阳路18号北京科技职业学院内",
            "age": 23,
            "phone": "13333335555"
        }
    ]
}

Comparison of Various Formats

1. Text format

    a. Advantages: concise content, less data transmission

    b. Disadvantage 1: Unable to adapt to complex business changes, for example, the back-end switches the phone and age, and the front-end will be confused if the data is not adjusted

    c. Disadvantage 2: It does not support hierarchical structure, and the hierarchical structure will be explained below

    d. Disadvantage 3: If the data contains vertical lines, the data will be confused when parsing. For example, the address information in "Zhang San|Male|No. 3|Male|No. 18 Shayang Road, Beijing Vocational College of Science and Technology - Service Building 2|3|4th Floor|23|13333335555", there will be many more fields when parsing

2. xml format

    a. Advantage 1: The format is clear, the order can be adjusted, and the new items in the back end will not affect the front end

    b. Advantage 2: Support hierarchical structure

    c. Advantage 3: Escaping can be performed when the data content is the same as the label

原文:“<addr>中国>北京>昌平>沙河>千锋教育</addr>”
转义为:“<addr>中国>北京>昌平>沙河>千锋教育</addr>”

    d. Disadvantage 1: The amount of data transmission is large, which is several times that of text, and the attribute description field needs to have start and end tags, for example: "<name>Zhang San</name>"

3. JSON format

    a. Advantage 1: The format is clear, the order can be adjusted, and the new items in the back end will not affect the front end

    b. Advantage 2: Support hierarchical structure (explain later)

    c. Advantage 3: Escaping can be performed when the data content is the same as the label

原始内容:"addr":"中国北京昌平沙河"千锋教育""
转义后:"addr":"中国北京昌平沙河\"千锋教育\""

    d. Advantage 4: The amount of data transmission is appropriate, and the attribute description field does not need to have a closing tag, for example: "name:"Zhang San""

Expand and talk about JSON?

JSON, that is, JavaScript Object Notation, literally translates to js object tags. It is a lightweight data exchange format consisting of key-value pairs for representing structured data

Now that we are talking about it, let’s be straightforward. JSON is evolved from the object data type in js. It is used to describe the attributes and values ​​​​of a certain object, and has a superior structure. In order to facilitate transmission, this data Transform it into a string, hey, isn’t it here? The js object data type is as follows:

//某个人
const person= {
    name:'张三',
    age:19,
    phone:'13333335555',
    addr:'国家省市县'
}
//省市县的对象,树状的层级结构
const addr = {
  "name": "中国",
  "type": "country",
  "children": [
    {
      "name": "北京市",
      "type": "province",
      "children": [
        {
          "name": "北京市",
          "type": "city",
          "children": [
            { "name": "东城区", "type": "county" },
            { "name": "西城区", "type": "county" },
            { "name": "朝阳区", "type": "county" },
            { "name": "海淀区", "type": "county" }
          ]
        }
      ]
    },
    {
      "name": "上海市",
      "type": "province",
      "children": [
        {
          "name": "上海市",
          "type": "city",
          "children": [
            { "name": "黄浦区", "type": "county" },
            { "name": "徐汇区", "type": "county" },
            { "name": "闵行区", "type": "county" },
            { "name": "宝山区", "type": "county" }
          ]
        }
      ]
    }
  ]
}

However, this is the object data type of js. The data type is essentially the way to store data in the memory. It is impossible for us to transfer the memory to the background.

picture

If the memory cannot be transferred, then transfer it to a string. According to the structure of the object data type, it is changed to a string format. County const addr), just do it, so we changed to the following:

let addrJSONString = `{
  "name": "中国",
  "type": "country",
  "children": [
    {
      "name": "北京市",
      "type": "province",
      "children": [
        {
          "name": "北京市",
          "type": "city",
          "children": [
            { "name": "东城区", "type": "county" },
            { "name": "西城区", "type": "county" },
            { "name": "朝阳区", "type": "county" },
            { "name": "海淀区", "type": "county" }
          ]
        }
      ]
    },
    {
      "name": "上海市",
      "type": "province",
      "children": [
        {
          "name": "上海市",
          "type": "city",
          "children": [
            { "name": "黄浦区", "type": "county" },
            { "name": "徐汇区", "type": "county" },
            { "name": "闵行区", "type": "county" },
            { "name": "宝山区", "type": "county" }
          ]
        }
      ]
    }
  ]
}`
//注意,我使用了反引号,这样的数据字符串可以换行

Composition of JSON

    ● Braces {}: used to indicate the beginning and end of an object, and an object is composed of a set of unordered key-value pairs.
    ● Square brackets []: used to indicate the beginning and end of the array, and the array is composed of a group of ordered values.  
    ● Colon:: used to separate the key and the value, and associate the key with the corresponding value.
    ● Comma,: Used to separate different key-value pairs or values ​​in an array or object, separating them.
    ● Double quotes " or single quotes ': used to enclose a character string, indicating the beginning and end of the character string.
    ● Backslash \: used to escape special characters to ensure correct parsing of special characters.

Written to the end: the elegance of JSON

    ●  Data size : JSON is usually smaller than XML. Since JSON adopts a concise syntax and does not need to add a large number of tags and attributes like XML, the data volume of JSON is relatively small. This makes JSON consume less bandwidth in network transmission, which is beneficial to improve the efficiency of data transmission.

    ●  Syntax complexity: In comparison, the syntax of XML is relatively complex. XML needs to use start tags and end tags to wrap data, while JSON only needs to use curly braces {} and square brackets [] to represent objects and arrays. This makes the JSON syntax more concise and readable.

    ●  Parsing efficiency: Due to the relatively simple syntax of JSON, its parsing speed is usually faster than XML. This is very important for the processing and analysis of large-scale data, especially in application scenarios that require real-time response.

    ●  Compatibility: JSON has good compatibility between front-end and back-end. Almost all mainstream programming languages ​​have JSON parsing and serialization libraries, which makes JSON more convenient for front-end and back-end interactions.

    ●  Readability: JSON is easier to read and write than XML. The structure of JSON is similar to JavaScript objects, which enables developers to understand the data structure more intuitively and facilitate debugging and development.

    ●  Scalability: Although XML has better scalability in some specific fields, the scalability of JSON is sufficient for general tree data structures. JSON supports nested objects and arrays, which can flexibly represent complex data structures.

    To sum up, JSON has the advantages of smaller data volume, more concise syntax, faster parsing efficiency and better compatibility when dealing with tree-shaped data structures such as provinces, cities, counties and cars. These advantages make JSON the preferred data format for processing tree data structures, especially widely used in modern web applications and mobile applications. However, for some specific needs, XML may still be a better choice, such as scenarios that require more complex structures and stronger scalability.

- End -

Guess you like

Origin blog.csdn.net/sdasadasds/article/details/132098786
Recommended