preface

When processing web requests, you need to work with JSON files. How to handle JSON files, common methods are json.stringify () and json.parse ().

1. JSON.stringify()

purpose

Converts a JavaScript object or value to a JSON string.

grammar

JSON.stringify(value[, replacer [, space]])
Copy the code

parameter

  • value

The value to be serialized into a JSON string.

  • replaceroptional

If the parameter is a function, each property of the serialized value is converted and processed by the function during serialization; If the parameter is an array, only the property names contained in the array will be serialized into the final JSON string; If this parameter is null or not provided, all the properties of the object are serialized.

  • spaceoptional

Specifies a blank string to be indented to beautify the output; If the argument is a number, it represents how many Spaces there are, up to 10.

The return value

JSON string.

practice

  • JSON.stringify(value)
const obj = {name: "John".age: 30.city: "New York"};
const myJSON = JSON.stringify(obj);
// Result: {"name":"John","age":30,"city":"New York"}
Copy the code

By default, json.stringify () outputs a JSON string that does not contain whitespace or indentation.

  • JSON.stringify(value, replacer])
<script> const result = [{name: 'zhangsan', weight: 80}, {name: 'lisi', weight: 70}, {name: 'xiaoming', weight: 35}, {name: 'xiaowang', location: 'xiaowang'}]; Function replacer (key, value) {if (key === 'weight') {if (value >= 80) {return 'weight'; } else if (value >= 60) {return 'normal '} else if (value >= 40) {return' underweight '} else {return 'underweight '}} return value} console.log(JSON.stringify(result, replacer, 2)) </script>Copy the code

The output results are displayed without indentation: [{” name “:” zhangsan “, “weight” : “overweight”}, {” name “:” lisi “, “weight” : “normal”}, {” name “:” xiaoming “, “weight” : “malnutrition”}, {” name “:” xiaowang.” “, “location” : “hangzhou}]

  • JSON.stringify(value[, replacer [, space]])– Configure the space parameter to beautify the display of JSON files
<script> const result = [{name: 'zhangsan', weight: 80}, {name: 'lisi', weight: 70}, {name: 'xiaoming', weight: 35}, {name: 'xiaowang', location: 'xiaowang'}]; Function replacer (key, value) {if (key === 'weight') {if (value >= 80) {return 'weight'; } else if (value >= 60) {return 'normal '} else if (value >= 40) {return' underweight '} else {return 'underweight '}} return value} console.log(JSON.stringify(result, replacer, 2)) </script>Copy the code

The output is indented by 2 Spaces:

[{"name": "zhangsan"."weight": "Fat"
  },
  {
    "name": "lisi"."weight": "Normal"
  },
  {
    "name": "xiaoming"."weight": "Malnutrition"
  },
  {
    "name": "xiaowang"."location": "Hangzhou"}]Copy the code

2. JSON.parse()

purpose

Parse a JSON string to construct JavaScript values or objects described by the string.

grammar

Copy the code

JSON.parse(text,[, reviver])

Copy the code

parameter

  • text

A string to be parsed into a JavaScript value.

  • reviveroptional

The converter, if passed, can be used to modify the original value generated by the parse. This function is traversed in the following order: starting at the innermost level, iterating outward in hierarchical order

The return value

The Object type corresponds to the Object/value of the given JSON text.

practice

  • JSON.parse(text, reviver)
<script>
      const numArray = '{" 1 ": 1," 2 ": 2," 3 ": {" 4" : 4, "5" : {" 6 ": 6}}}'
      function reviver(k, v) {
        console.log(k)
        return v
      }
      const aiAa = JSON.parse(numArray, reviver)
      console.log(aiAa)
      console.log(typeof aiAa)
    </script>
Copy the code

Output results:

Reference documentation

  • mdn : JSON.stringify(), JSON.parse()
  • w3c : JSON.stringify(), JSON.parse()