序列化一个javascript类对象?

Iam*_*Man 4 javascript serialization json object

要求很简单。这里有一堂课...

class myobj {

    constructor(var1, var2) {
        this.var1 = var1;
        this.var2 = var2;
    }

    addThemUp() {
        return this.var1 + this.var2;
    }

}
Run Code Online (Sandbox Code Playgroud)

现在我制作其中之一...

var myInstance = new MyObj(3, 7);
Run Code Online (Sandbox Code Playgroud)

迷人的。但是现在我需要序列化它,以便我可以保存它并稍后加载它。就像是...

serialise(myInstance);
// Save to a file
// ... do some other stuff ...
// load from file
myInstance = unserialise(fileData);
// - or - 
unserialise(fileData, myInstace);
// etc...
Run Code Online (Sandbox Code Playgroud)

如何?我不在乎表示采用什么形式,因为它将被同一页面加载。如果仅保存值,则将它们加载回对象的通用方法会很好,因为同一页面具有用于查找函数定义的类“模板”。

该对象很大且不断变化,因此从 JSON 手动复制值以保留函数实际上是不可维护的。但是可以使用任意数量和类型的变量来实现这一点的解决方案将很有用。

我还必须坚持使用 vanilla、单文件 javascript,尽管在现代浏览器中。

TL;DR:如何在不丢失功能的情况下序列化和反序列化对象?

ibr*_*rir 7

您可以使用JSON.stringify,但请注意它只序列化属性,而不是方法。因此,要反序列化对象,只需创建一个虚拟实例并使用Object.assign检索到的对象更新属性:

function serialize(instance) {
    var str = JSON.stringify(instance);
    // save str or whatever
}

function unserialize(str, theClass) {
    var instance = new theClass();                  // NOTE: if your constructor checks for unpassed arguments, then just pass dummy ones to prevent throwing an error
    var serializedObject = JSON.parse(str);
    Object.assign(instance, serializedObject);
    return instance;
}
Run Code Online (Sandbox Code Playgroud)

例子:

function serialize(instance) {
    var str = JSON.stringify(instance);
    // save str or whatever
}

function unserialize(str, theClass) {
    var instance = new theClass();                  // NOTE: if your constructor checks for unpassed arguments, then just pass dummy ones to prevent throwing an error
    var serializedObject = JSON.parse(str);
    Object.assign(instance, serializedObject);
    return instance;
}
Run Code Online (Sandbox Code Playgroud)