JSON

JSON (JavaScript Object Notation) is a lightweight data exchange format that uses a text format that is completely independent of programming languages to store and represent data

Before JSON, we used XML to transfer data (XML translation is Extensible Markup Language, which is a plain text format suitable for transferring data on the network), but as XML became more and more complex, people began to invent easier The data exchange format, finally in 2002 Douglas Crockford (Douglas Crockford) invented JSON, we just need to remember that JSON is a subset of JavaScript, you can use JSON directly in JavaScript to achieve serialization and deserialization change

First look at the data types in JSON, which are basically the same as JavaScript (Attention bold words!)

type name	explain
number	Numeric type, same as JavaScript's number
boolean	Boolean, only true and false two values
string	String type, needless to say, but be careful to use " ", not ' '
null	Null value means nothing
array	Array, data enclosed by []
object	Object, the same as the object in JavaScript, use {}, each of which uses " "

/* JSON 标准格式：
{
	"键名称1": 100,
	"键名称2": "我是字符串，使用双引号",
	"键名称3": true,
	"键名称4": null,
	"键名称5": [200, "数组中字符串", null],
	"键名称6": {"对象健名称1": 200, "对象健名称2": "我也是字符串"}
} */

//看不懂怎么办（我书读的少，你别骗我），那我下面写一个例子就能明白了

'use strict'

let Mike = {
    
    
    name: 'Mike',
    age: 21,
    school: "清华大学"
};

let obj = {
    
    
    key1: 100,
    key2: 'Hello world',
    key3: false,
    key4: null,
    key5: [200, '300', [true, false]],
    key6: Mike
};

/* 将 JavaScript 对象转换成 JSON 字符串，实现序列化：
JSON.stringify(value, replacer, space)
value：		待序列化的对象;

replacer：	控制如何筛选对象的键值，可以是函数或者数组（可选）;
			数组里可以放想要筛选的键值，例如["key1", "key2"]，注意请使用 ' ' 或者 " "
            函数就是处理键值，比方说可以在变成 JSON 字符串的时候把所有的英文键改成大写
             
space：		输出文本添加缩进、空格和换行符（可选）
			就是让格式好看点 */

let obj_JSON = JSON.stringify(obj, null, '\n');		//使用一个空格填充
console.log(obj_JSON);



/* 将字符串变成 JavaScript 对象，实现反序列化
JSON.stringify(value, reviver) 
value：待转换的字符串;

reviver：和 replacer 蛮像的，但是只能是函数（可选）*/

let obj_JS_object = JSON.parse(obj_JSON);
console.log(obj_JS_object);

Console output:

Important note:

Even if the string in the object uses ' ', it will become " " after converting to JSON
Will add " " to each key

In fact, mastering the previous knowledge points is enough for beginners, the following is supplementary knowledge

/* 上边我们介绍了可以设置 stringify() 函数的 replacer 参数，在一定程度上控制序列化的结果
   现在我们可以完全实现自定义序列化，那就是使用 toJSON() 函数：toJSON() 函数可以返回一个 JSON 字符串 */

/* 对于下面的 Book 对象，现在我只想序列化 name 和 price */
//1、通过设置 replacer 的方法
let Book = {
    
    
    name: '入门 JavaScript',
    ISBN: 12345678901234,
    price: 99
};

let Book_JSON = JSON.stringify(Book, ["name", "price"]);
console.log("使用 replacer 实现自定义序列化 ↓↓↓");
console.log(Book_JSON);



//2、在 Book 对象内部重写 toJSON() 函数

let Book = {
    
    
    name: '入门 JavaScript',
    ISBN: 12345678901234,
    price: 99,
    //重写 toJSON() 函数，直接返回我们自定义的结果（只要符合格式要求，键值名字随便改，下面我就把首字母变成中文，但是尽量不要使用中文，这里只是为了示范）
    toJSON: function () {
    
    
        return {
    
    
            "书名": "入门 JavaScript",
            "价格": 99
        }
    }
};

let Book_JSON = JSON.stringify(Book);
console.log("重写 toJSON() 函数实现自定义序列化 ↓↓↓");
console.log(Book_JSON);

Result display

Note that once the toJSON() function is overridden, it is not feasible to also set the replacer parameter . You can understand it as a matter of priority

So let’s talk so much about JSON first, just have a concept, and you will be familiar with it if you use it more in the future

Understand what is JSON in one article

JSON

Guess you like