js语言中不同数据类型的序列化和反序列化

缺乏、安全感 2023-03-06 08:13 9阅读 0赞

###### *最新更新时间：2020年08月06日22:51:48* ######

#### [`《猛戳-查看我的博客地图-总有你意想不到的惊喜》`][-_-] ####

> 本文内容：  
> 数据的序列化，是指将非String类型的数据转化为String类型的数据；  
> 数据的反序列化，是指将序列化后的String类型的数据转化为序列化前的类型的数据；

#### JavaScript数据类型的识别方法及限制 ####

*  四种方法：typeof || instanceof || constructor || Object.prototype.toString

//typeof 判断基本数据类型
    //能够识别基本数据类型 Null会被识别成object
    //不能识别具体的引用类型 Function除外
    console.log(typeof 1);//number
    console.log(typeof '');//string
    console.log(typeof true);//boolean
    console.log(typeof undefined);//undefined
    console.log(typeof function(){ });//function
    console.log(typeof null);//object
    console.log(typeof new Date());//object
    console.log(typeof /[a-z]/);//object
    console.log(typeof []);//object
    console.log(typeof { });//object
    console.log('----------------');
    //instanceof 判断左边是否是右边的实例对象 所有的对象都是Object的实例
    //能够识别内置对象类型(引用数据类型) 自定义类型及其父类型
    //不能识别标准类型(基本数据类型) 返回false
    //不能识别undefined和null 会报错
    console.log(1 instanceof Number);//false
    console.log('' instanceof String);//false
    console.log(true instanceof Boolean);//false
    // console.log(undefined instanceof undefined);//报错
    console.log(function(){ } instanceof Function);//true
    // console.log(null instanceof null);//报错
    console.log(new Date() instanceof Date);//true
    console.log(/[a-z]/ instanceof RegExp);//true
    console.log([] instanceof Array);//true
    console.log([] instanceof Object);//true
    console.log(function(){ } instanceof Object);//true
    console.log({ } instanceof Object);//true
    console.log('----------------');
    //constructor 获取构造函数
    //能够识别标准类型(基本数据类型)、内置对象类型(引用数据类型)、自定义类型
    //不能识别undefined、null会报错，因为它们没有构造函数
    console.log((1).constructor);//function Number() { [native code] }
    console.log(('').constructor);//function String() { [native code] }
    console.log(true.constructor);//function Boolean() { [native code] }
    // console.log(undefined.constructor);//报错
    console.log((function(){ }).constructor);//function Function() { [native code] }
    // console.log(null.constructor);//报错
    console.log((new Date()).constructor);//function Date() { [native code] }
    console.log(/[a-z]/.constructor);//function RegExp() { [native code] }
    console.log([].constructor);//function Array() { [native code] }
    console.log({ }.constructor);//function Object() { [native code] }
    console.log('----------------');
    //Object.prototype.toString 对象类属性 获取目标对象类型
    //能够识别标准类型(基本数据类型)和内置对象类型(引用数据类型) 不能识别自定义类型
    console.log(Object.prototype.toString.call(1));//[object Number]
    console.log(Object.prototype.toString.call(''));//[object String]
    console.log(Object.prototype.toString.call(true));//[object Boolean]
    console.log(Object.prototype.toString.call(undefined));//[object Undefined]
    console.log(Object.prototype.toString.call(function () { }));//[object Function]
    console.log(Object.prototype.toString.call(null));//[object Null]
    console.log(Object.prototype.toString.call(new Date()));//[object Date]
    console.log(Object.prototype.toString.call(/[a-z]/));//[object RegExp]
    console.log(Object.prototype.toString.call([]));//[object Array]
    console.log(Object.prototype.toString.call({ }));//[object Object]

#### Boolean ####

let a = true;
    //序列化
    let serializationA = JSON.stringify(a);
    //反序列化
    let deserializationA = JSON.parse(serializationA);
    console.log(typeof serializationA);//string
    console.log(typeof deserializationA);//boolean

#### Number ####

let a = 1;
    //序列化
    let serializationA = JSON.stringify(a);
    //反序列化
    let deserializationA = JSON.parse(serializationA);
    console.log(typeof serializationA);//string
    console.log(typeof deserializationA);//number

#### Undefined ####

*  undefined类型无法进行反序列号

> 报错：Uncaught SyntaxError: Unexpected token u in JSON at position 0

let a = undefined;
    //序列化
    let serializationA = JSON.stringify(a);
    console.log(typeof serializationA);//undefined
    //反序列化 报错
    let deserializationA = JSON.parse(serializationA);// 报错

#### Null ####

let a = null;
    //序列化
    let serializationA = JSON.stringify(a);
    //反序列化
    let deserializationA = JSON.parse(serializationA);
    console.log(typeof serializationA);//string
    console.log(typeof deserializationA);//object

#### Regexp ####

*  正则表达式会被转化为空对象

let a = /[a-z]/ig;
    //序列化
    let serializationA = JSON.stringify(a);
    //反序列化
    let deserializationA = JSON.parse(serializationA);
    console.log(serializationA);//{}
    console.log(deserializationA);//{}

#### Array ####

let a = [1,2,3];
    //序列化
    let serializationA = JSON.stringify(a);
    //反序列化
    let deserializationA = JSON.parse(serializationA);
    console.log(typeof serializationA);//string
    console.log(deserializationA instanceof Array);//true

#### Object ####

*  场景一：对象没有嵌套，使用 JSON.stringify 和 JSON.parse 进行序列化和反序列化；
 *  对象中的值如果是函数，会直接丢失kv对；对象中的值如果是正则表达式，会将正则表达式转化为空对象；

*  场景二：对象没有嵌套，兼容函数和正则表达式的方案，但是丢失数据类型，在进行反序列化的过程中也只是一种伪方法；

*  场景三：对象嵌套，丢失数据类型，在进行反序列化的过程中也只是一种伪方法；

#### 同一个正则表达式第二次匹配不到的解决方案 ####

*  异常场景

let str = '[1,2,3]'
    let reg = /^\[.*\]$/ig;
    console.log(reg.test(str));//true
    console.log(reg.test(str));//false

*  解决方案一：取消正则表达式修饰符g，不执行全局匹配

> g 修饰符用于执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）

let str = '[1,2,3]'
    let reg = /^\[.*\]$/i;
    console.log(reg.test(str));//true
    console.log(reg.test(str));//true

*  解决方案二：重置正则表达式的lastIndex属性为0或者-1

let str = '[1,2,3]'
    let reg = /^\[.*\]$/i;
    console.log(reg.test(str));//true
    reg.lastIndex = -1;
    console.log(reg.test(str));//true