Comment stocker un objet complexe en javascript

Question

J'ai un objet complexe de ce type :

class Person {
  constructor(name, age, country) {
    this.name = name;
    this.age = age;
    this.country = country;
  }

  setName(name) {
    if (name !== null) this.name = name;
  }
  setAge(age) {
    if (age !== null) this.age = age;
  }
  setCountry(country) {
    if (country !== null) this.country = country;
  }

  getName() {
    return this.name;
  }

  // ...
}

let person = new Person('Paul', 27, 'Haïti'); // needs to save this Object
console.log(person);

J'aimerais donc savoir si quelqu'un a une idée sur la façon dont je peux stocker cet objet afin de pouvoir y accéder la prochaine fois que j'ouvre le navigateur. localStorage ne fonctionne pas.

Answer 1

LocalStorage fonctionne - il suffit de l'utiliser correctement.

J'ai ajouté un toJSON sur la classe - cela renvoie un tableau avec les valeurs des paramètres du constructeur dans le bon ordre.

class Person {
    constructor(name, age, country) {
        this.name = name;
        this.age = age;
        this.country = country;
    }
    toJSON() {
        return [this.name, this.age, this.country];
    }
    setName(name) {
        if (name !== null) this.name = name;
    }
    setAge(age) {
        if (age !== null) this.age = age;
    }
    setCountry(country) {
        if (country !== null) this.country = country;
    }
    getName() {
        return this.name;
    }
}

Pour économiser

const person = new Person("John", 23, "Aussie");
localStorage.setItem('test', JSON.stringify(person));

Pour charger

const revivedPerson = new Person(...JSON.parse(localStorage.getItem('test')));

Vous n'êtes pas obligé d'utiliser la méthode toJSON, mais cela permet d'obtenir un code simple (si vous n'avez jamais besoin de JSON.stringifier une instance de Person).

Answer 2

J'ajouterais une méthode statique à la classe, qui peut prendre un objet ordinaire et retourner une instance de la classe en retour. Vous pouvez utiliser Object.create y Object.assign pour ça.

Démonstration :

class Person {
  constructor(name, age, country) {
    this.name = name;
    this.age = age;
    this.country = country;
  }
  static from(obj) {
    return Object.assign(Object.create(this.prototype), obj);
  }
  getName() {
    return this.name;
  }
  // ...
}

// Demo
let person = new Person('Paul', 27, 'Haïti');
let serialised = JSON.stringify(person);
// ... write/read serialised to/from localStorage ...
// and then:
let person2 = Person.from(JSON.parse(serialised));
console.log(person2.getName());