如何给 javascript 物体补水

how to hydrate a javascript object

我在一页上填充了一个 javascript 对象 (userObject),然后我使用 JSON.stringify

将该对象添加到本地存储中

现在在下一页,我想用第一页上的 localStorage 中的值重新水化一个 userObject。

userObject全局变量声明一次,在shared/commonjavascript.

但使用当前逻辑,登录页面将用户名和用户 ID 存储在 userObject 中,然后 window.location.href 进行页面重定向。这是 userObject 中的数据被清除的地方(假设旧对象被冲走,有利于新页面上的新对象)。

问题是,如何使用 localStorage 中的值对主页上的新 userObject 进行再水化。

这是我如何加载 locastorage

localStorage.setItem('userObject', JSON.stringify(userObject));

这就是我对重新水化 userObject 的想法

userObject = localStorage.getItem('userObject');

但是在查看 userObject 时...它只是一个字符串或值,它不会重新创建对象并填充值,它只是一个长字符串...

localstorage 无法知道原始对象的情况。您需要显式调用 JSON.parse().

userObject = JSON.parse(localStorage.getItem('userObject'));

更新:

请注意,JSON 中从未序列化或支持函数。这是因为从生成的 "source code" 重建函数或原型是不可靠的,因为 a) 原型未在 JSON 中捕获并且 b) 函数可能可以访问闭包。

为了在再水化对象原型上有方法,按以下方式进行:

// User constructor function
function User() {

}

User.prototype.isValid = function () {
  return true;
};

User.prototype.isAdmin = function () {
  return this.name === "admin";
};

// create and serialize an object
var userA = new User();
userA.name = "admin";

var copy = JSON.parse(JSON.stringify(userA));

// rehydrate with functions on prototype
var userB = new User();
for (var prop in copy) {
  if (Object.prototype.hasOwnProperty.call(copy, prop)) {
    userB[prop] = copy[prop];
  }
}

console.log(userB.isAdmin());