开发者问题收集

未捕获的类型错误：无法读取 null 的属性“push” - 我的解决方案是否有效/正确

2018-01-29
1269
javascript arrays local-storage

我试图将一个对象推送到名为“contactBook”的数组中，然后将其存储到本地存储中，但出现以下错误 -

这是所有无效解决方案（来自研究）的错误描述 -

Uncaught TypeError: Cannot read property 'push' of null

我尝试了几种无效的解决方案。我找到了一个解决方案，但不确定它是否有效！

我通过 Stack Overflow、MDN、Google、Youtube 和其他网站对此进行了大量研究，以找到解决方案，但直到我尝试了其他方法，令人惊讶的是，这些方法并未在研究中出现。

我之所以问这个问题，是因为我使用的有效解决方案并未出现在我所做的任何研究中。我只是想“哎呀，让我试试看它是否有效”。我认为需要先设置项目键/值“addbook”和“[]”。

所以我在想，这个解决方案真的有效吗？ 

let contactBook = (localStorage.getItem('addbook')) ? JSON.parse(localStorage.getItem('addbook')) : localStorage.setItem('addbook', JSON.stringify([]));;

解决方案之前的原始代码不起作用 - 

let contactBook = JSON.parse(localStorage.getItem('addbook')) || [];

解决方案 1 不起作用 - 

let contactBook = JSON.parse(localStorage.getItem('addbook'));

  if (contactBook === null) {
    contactBook = [];
  };

解决方案 2 不起作用 - 

let contactBook = (localStorage.getItem('todoList')) ?JSON.parse(localStorage.getItem('addbook')) : [];

所有这些研究过的解决方案都在本地主机上运行，​​但在实时服务器上不起作用，除了我的解决方案有效。

我的解决方案有效吗，即使它有效，为什么所有解决方案都在本地主机上运行，​​而不是在实时服务器上？

这是完整的网站/应用程序，您可以通过开发人员工具导航到完整的 js.app http://www.darsh-p.tk/diary/index.html

2个回答

您的问题没有解释您想要实现的目标。我猜您正试图将数据推送到数组中。在这种情况下， 

let contactBook = [];
const contactBookStr = localStorage.getItem('addbook');

if (contactBookStr) {
  try {
    let contactBook = JSON.parse(contactBookStr);
  } catch (err) {
    console.log('The data stored in "addbook" is invalid.');
  }
}

//...your code continues..

这应该可行。如果值是无效的 JSON 对象， JSON.parse() 将引发错误，因此您需要捕获错误并进行处理。

您应该注意，根据您的应用程序的工作方式，您的解决方案不太可能为您提供所需的结果，因为 localStorage.setItem() 返回 undefined 。

Samuel Imolorhe
2018-01-29

让我们检查一下您的代码： 

let contactBook = JSON.parse(localStorage.getItem('addbook')) || [];

这意味着您有变量 contactBook ，并且您正在为其分配一个对象（JSON），您要将 [] 与该对象进行 OR 运算。

如果 localStorage.getItem('addbook') 的结果是一个字符串，您可以执行以下操作： 

let contactBook[localStorage.getItem('addbook')] = [] ;

例如，如果 localStorage.getItem('addbook') 返回“abcd”，那么您将拥有 contactBook.abcd[] 这个数组对象。

如果您想将元素推送到 contactBook ，很简单： 

let contactBook = [] ;
contactBook.push(<object>) ;
FDavidov
2018-01-29