Использование ключа LocalStorage для вызова значения объекта

Question

В основном у меня есть локальный ключ хранения «rhand» со значением «sword4» и объект с именем sword4.

Я хочу, чтобы это было Dynami c, чтобы я мог переключить имя элемента в локальное хранилище, такое как "sword1", "sword2", а затем оно содержит уникальную информацию о том, что есть в div.

, который я могу поместить в sword4.name; и это вызовет имя «стальной меч», но rhand1.name; не делает этого, он говорит undefined ...

Я более знаком с PHP, и кажется, что это будет работать в PHP, но это не имеет смысла в JavaScript. Извините, если мой Engli sh трудно понять.

Вот код:

localStorage.setItem("rhand", "sword4");

let sword4 = {
  name: "steel sword",
  info: "a sharp steel sword",
  def: "0",
  str: "10",
  int: "0",
  agi: "0",
  lbs: "3"
};

let rhand1 = localStorage.getItem("rhand");
document.getElementById("rhand").innerHTML = rhand1.name;

<div id="rhand"></div>

Answer 1

let sword4 = {
  name: "steel sword",
  info: "a sharp steel sword",
  def: "0",
  str: "10",
  int: "0",
  agi: "0",
  lbs: "3"
};
localStorage.setItem("rhand", JSON.stringify(sword4));

let rhand1 = JSON.parse(localStorage.getItem("rhand"));
document.getElementById("rhand").innerHTML = rhand1.name

Попробуйте и, пожалуйста, закройте вопрос, как только это будет сделано.

Answer 2

localStorage может хранить только строки, поэтому, когда вам нужно сохранить что-то, кроме String, например, Array, Object или Number - преобразуйте его в строку с JSON.stringify(). Когда вы хотите получить что-то из localStorage, преобразуйте его обратно с JSON.parse().

Demo

Примечание: SO не допускает API WebStorage. Полнофункциональную демонстрацию смотрите в этой Fiddle

let sword4 = {
  name: "steel sword",
  info: "a sharp steel sword",
  def: "0",
  str: "10",
  int: "0",
  agi: "0",
  lbs: "3"
};

localStorage.setItem("rhand", JSON.stringify(sword4));

let rhand1 = JSON.parse(localStorage.getItem("rhand"));

document.getElementById("rhand").innerHTML = rhand1.name;

<div id="rhand"></div>