Question

无法读取 null 的属性“push”

2014-04-19

8980

javascript jquery typeerror

我有一个可以在本地主机上运行的页面。当我将其放在远程服务器上时，它出现了错误。返回错误的代码是

  var $app_list = localStorage.getItem('LsAppList');
  var AppListJson = JSON.parse($app_list);
      AppListJson.push({ 
        "extapp_id": appdetail.get("addAppId"),
        "desc": appdetail.get("addAppName"),
        "device_no": appdetail.get("devicenoValue"),
        "validation_key": appdetail.get("activationkeyValue") 
    });

控制台日志是

Uncaught TypeError: Cannot read property 'push' of null
addToJson EncigoHome.js:126
n.extend.trigger kendo.mobile.min.js:9
s.extend._release kendo.mobile.min.js:15
i._userEvents.o.UserEvents.tap kendo.mobile.min.js:15
n.extend.trigger kendo.mobile.min.js:9
l.extend.notify kendo.mobile.min.js:13
u.extend._trigger kendo.mobile.min.js:13
u.extend.end kendo.mobile.min.js:13
l.extend._eachTouch kendo.mobile.min.js:13
l.extend._end kendo.mobile.min.js:13
arguments.length.t.(anonymous function) kendo.mobile.min.js:10
b.event.dispatch jquery-1.9.1.js:9593
v.handle

Answer 1

localStorage 是针对每个域的（更具体地说是同源）。与远程域关联的 localStorage 无权访问与您的本地主机关联的 localStorage 中存储的值。

您应该检查是否有存储的值并恢复为默认值，或者处理错误：

var $app_list = localStorage.getItem('LsAppList');
var AppListJson = $app_list != null ? JSON.parse($app_list) : [];
//...

更详细：

var $app_list = localStorage.getItem('LsAppList'),
    AppListJson;
if ($app_list != null) {
    AppListJson = JSON.parse($app_list);
} else {
    // treat no LsAppList stored case
    // you could show a message or set it to a default value
    AppListJson = [];
}

每当用户清除浏览器数据或切换浏览器/设备时，都会发生这种“没有先前存储的数据”情况，因此必须正确处理。

您可能已经发现，错误的根本原因是，当当前域中没有为给定的 key 存储任何值时， localStorage.getItem(key) 返回 null 。然后 JSON.parse(null) === null 和 null.push() 抛出。

作为一个挑剔，我建议检查一下你的变量命名：

不要对非构造函数使用 PascalCase 命名。
不要将 camelCase 与下划线命名约定混合使用。
推荐阅读： Idiomatic.js 命名。

此外， AppListJson 不是 JSON，它是一个原生数组。JSON 只能存在于字符串上下文中，也就是说，你的 $app_list 是 JSON。有关 JSON/非 JSON 的更深入解释：没有“JSON 对象”这样的东西

Answer 2

.push() 方法只能用于数组。

似乎您没有将项目存储在 localStorage 中，这就是它返回 null 的原因>