Хранить объекты в локальном хранилище JS

Question

Я пытаюсь выполнить регистрацию HTML и JS, в которой данные для входа будут сохранены в LocalStorage. У меня есть класс с 2 параметрами, один из них - пароль.

Затем у меня есть функция, которая создаст объект через этот класс и сохранит его в локальном хранилище.

Мне нужно, чтобы имя объекта было именем пользователя (input id="username_r").

Моя проблема в том, что когда я делаю, например, console.log(user1), на выходе получается [object Object]

class user {
  constructor(status, password) {
    this.status = status;
    this.password = password;
  }
}

function signup() {
  pw = document.getElementById("password_r").value;
  window[document.getElementById("username_r").value] = new user("active", pw);
  localStorage.setItem(document.getElementById("username_r").value, window[document.getElementById("username_r").value]);
}

<div class="form">
  <input type="text" name="username" id="username_r" placeholder="Utilizador" required>
  <br>
  <br>
  <input type="password" name="password" id="password_r" placeholder="Password" required>
  <br>
  <br>
  <button id="registar" onclick="signup()">Criar Conta!</button>
</div>

Answer 1

Если вы хотите придерживаться использования класса, то вы могли бы переопределить метод toString() для создания формы json элемента. И вы можете сохранить это в localStorage. Затем, когда вам снова понадобится экземпляр класса, вам нужно будет проанализировать json и снова создать элемент из данных. Чтобы централизовать этот logi c, вы можете создать метод stati c для класса, который также выполняет этот logi c.

class user {
  constructor(status, password) {
    this.status = status;
    this.password = password;
  }
  
  static build(json) {
    var temp = JSON.parse(json);
    return new user(temp.status, temp.password);
  }
  
  toString() {
    return JSON.stringify({
      status: this.status,
      password: this.password
    });
  }
}

var user1 = new user('admin', 'nimda');
// force the usage of the `toString` method for show
console.log('My user: '+ user1);

var storedString = user1.toString();
console.log(storedString);

// use a static method to re-build the instance
var user2 = user.build(storedString);
console.log(user2);

Answer 2

Я помещаю несколько образцов строковых значений и сохраняю только stringified объект. Затем получите ключ и проанализируйте его. Это работает.

class user {
  constructor(status, password) {
    this.status = status;
    this.password = password;
  }
}

function signup() {
  pw = "myPwd";
  window["user"] = new user("active", pw);
  console.log(window["user"]);
  localStorage.setItem("user",JSON.stringify(window["user"]) ); //Stringygy the object
};

signup();


 var x = localStorage.getItem("user");
 var myUser = JSON.parse(x); //This will give you the data of window['user']