使用 JSON.Stringify 序列化数据的坑

原文地址

前言

项目中时常会使用到 JSON.Stringify来将数据转为JSON字符串形式,例如设置本地缓存 localStorage时需要将数据转换为字符串形式等等。

今天就在这里列举一下使用 JSON.Stringify的几个注意事项

以一个涵盖了大部分数据类型的对象为例

let my_obj = {
    func: function () {
        alert(1);
    },
    obj: { a: 1 },
    arr: [1, 2, 3],
    und: undefined,
    reg: /123/,
    date: new Date(0),
    NaN: NaN,
    infinity: Infinity,
    sym: Symbol(1)
};
Object.defineProperty(my_obj, "innumerable", {
    enumerable: false,
    value: "innumerable"
});

console.log("obj1", obj1);
let str = JSON.stringify(my_obj);
let my_obj2 = JSON.parse(str);
console.log('obj2',my_obj2);

运行结果如下:


JSON.stringify前后数据对比

使用 JSON.stringifyJSON.parse数据,前后变化表明,使用JSON.stringify序列化之后的数据,在JSON.parse会丢失部分数据。

总结JSON.stringify序列化数据的注意事项

  • 使用JSON.Stringify 转换的数据中,如果包含 functionundefinedSymbol,这几种类型,不可枚举属性, JSON.Stringify序列化后,这个键值对会消失

  • 转换的数据中包含 NaNInfinity 值(含-Infinity),JSON序列化后的结果会是null

  • 转换的数据中包含Date对象,JSON.Stringify序列化之后,会变成字符串

  • 转换的数据包含RegExp 引用类型序列化之后会变成空对象

  • 无法序列化不可枚举属性

  • 无法序列化对象的循环引用,(例如: obj[key] = obj)。

  • 无法序列化对象的原型链

注意:
虽然 JSON.Stringify使用起来简单又方便,但是,在使用 JSON.Stringify 要考虑以上的注意事项,避免给自己挖坑。

你可能感兴趣的:(使用 JSON.Stringify 序列化数据的坑)