localStorageからES6クラスオブジェクトを解析する際にクラス関数が含まれない

Question

HTML5のlocalStorageにクラスオブジェクトを永続化したい。クラスには、永続化する必要のあるメソッドも含まれていますが、localStorageオブジェクトを解析すると、オブジェクトが同じでないことがわかります。それはプロパティとメソッドだとコンソールで

class ExcitingMath { 

    constructor(firstNumber, secondNumber) { 

     this._firstNumber = firstNumber; 
     this._secondNumber = secondNumber; 
    } 

    add() { 

     return this._firstNumber + this._secondNumber; 
    } 

    subtract() { 

     return this._firstNumber - this._secondNumber; 
    } 
} 

const eMath = new ExcitingMath(2, 4); 

ログeMathは、クラスのオブジェクトを表示しません：

しかし、localStorageへとからI localStorage.setItem("math", JSON.stringify(eMath));とJSON.parse(localStorage.getItem("math"));オブジェクト、それはもはや含まれている場合コンストラクタまたはメソッド。

にはどうすればいいのlocalStorageと元のクラスのインスタンスを永続化することができますか？

Answer 1

JSON.toStringはオブジェクトのSTATEを保存するだけで、すでに見つかったオブジェクトの機能は保存しないため、これは不可能です。私は同じ「問題」を直面してのlocalStorageからJSONを取り、次のようにオブジェクトにあることを変換私のクラスで機能「fromJSON」を書いた：

class ExcitingMath { 

    constructor(firstNumber, secondNumber) { 

     this._firstNumber = firstNumber; 
     this._secondNumber = secondNumber; 
    } 

    add() { 

     return this._firstNumber + this._secondNumber; 
    } 

    subtract() { 

     return this._firstNumber - this._secondNumber; 
    } 

    static fromJSON(serializedJson) { 
     return Object.assign(new ExcitingMath(), JSON.parse(serializedJson)) 
    } 
} 

次のようにあなたがそれを使用することがあります：

const eMath = ExcitingMath.fromJSON(JSON.parse(localStorage.getItem("math")))