从 localStorage Typescript/JavaScript 中提取用户名答案

【问题标题】：Extract username from localStorage Typescript/JavaScript从 localStorage Typescript/JavaScript 中提取用户名
【发布时间】：2018-09-22 00:21:25
【问题描述】：

我还是 Typescript 的新手，我只想从这个 localStorage 输出 用户名：

localStorage.getItem('currentUser')

当前输出： {"用户名":"root","密码":"root"}

我该怎么做？

【问题讨论】：

标签： javascript typescript local-storage

【解决方案1】：

您需要使用 JSON.parse

将 JSON 字符串转换回 Object

var user = JSON.parse(localStorage.getItem('currentUser'));

然后您可以访问其中的用户名字段

if(user){
   console.log(user.username);
}

【讨论】：

【解决方案2】：

简答：使用JSON.parse将字符串转换回对象：

var user = JSON.parse(localStorage.getItem('currentUser'));
console.log(user.username);

（注意：这通常适用于 JavaScript，而不仅仅是 TypeScript）

详情

项目以字符串形式存储在localStorage 中。因此，要将对象保存在localStorage 中，请使用JSON.stringify(obj) 将其转换为字符串。（将您的用户对象保存到localStorage 的人可能使用了这种方法。）

要转换回对象，请使用JSON.parse(str)。请注意，如果字符串不是对象的有效 JSON 表示形式，这可能会引发异常。

用户对象的所有示例（如果您删除类型声明，它也是有效的 JavaScript）：

interface IUser {
  username: string;
  password: string; // please don't do this in real code
}

function saveCurrentUser(user: IUser): void {
  localStorage.setItem('currentUser', JSON.stringify(user));
}

function getCurrentUser(): IUser {
  var userStr = localStorage.getItem('currentUser');
  try {
    return JSON.parse(userStr);
  } catch (ex) {
    return null; // or do some other error handling
  }
}

var user = { username: 'root', password: 'root' };
saveCurrentUser(user);

// elsewhere...
var savedUser = getCurrentUser();
if (savedUser) {
  console.log('Current user: ' + savedUser.username);
} else {
  console.log('Current user not found');
}

【讨论】：