Javascript 用户：索引未定义？

我使用用户名登录创建了一个localStorage，并将JSON数据（条目）的字符串解析为一个普通对象

但是，如果我尝试控制台log entry.username，我会得到我存储的用户，但也会得到一个“未定义的”

我怀疑是我的User:index代码弄乱了条目。User\u name

var User = {
    index: window.localStorage.getItem("User:index"),
    $form: document.getElementById("userReg"),


    $button_register: document.getElementById("registerUser"),
    $button_login: document.getElementById("logIN"),

    init: function() {
        // initialize storage index
        if (!User.index) {
            window.localStorage.setItem("User:index", User.index = 1);
        }

        User.$form.addEventListener("submit", function(event) {
            var entry = {
                id: parseInt(this.id_entry.value),
                user_name: this.user_name.value,
            };
            if (entry.id == 0) {
                User.storeAdd(entry);
            }
        }, true);


        User.$button_login.addEventListener("click", function(entry) {

            for (var i = 0, len = localStorage.length; i < len; ++i) {
                var key = localStorage.key(i);
                var value = localStorage[key];
                entry = JSON.parse(window.localStorage.getItem(key));
                console.log(entry.user_name);
            }

            if (document.getElementById("firstName").value == entry.user_name) {
                alert("You have logged in");

            } else {
                document.getElementById("negative").innerHTML = "Username does not match"
            }


        }, true);


    },

    storeAdd: function(entry) {
        entry.id = User.index;
        window.localStorage.setItem("User:index", ++User.index);
        window.localStorage.setItem("User:" + entry.id, JSON.stringify(entry));
    },


};



User.init();

var用户={
索引：window.localStorage.getItem（“用户：索引”），
$form:document.getElementById（“userReg”），
$button_register:document.getElementById（“registerUser”），
$button_login:document.getElementById（“login”），
init:function（）{
//初始化存储索引
如果（！User.index）{
window.localStorage.setItem（“User:index”，User.index=1）；
}
用户.$form.addEventListener（“提交”），函数（事件）{
变量项={
id:parseInt（this.id\u entry.value），
user\u name:this.user\u name.value，
};
if（entry.id==0）{
User.storeAdd（条目）；
}
}，对）；
用户.$button\u登录.addEventListener（“单击”），函数（条目）{
for（变量i=0，len=localStorage.length；i

问题在于本地存储中的数据。您的登录函数假定存储在localStorage中的所有条目都是您的

用户

条目类型。但是，当您开始存储其他东西时，您没有检查以确认类型是否符合预期

在这里：

这是一把小提琴：

---

免责声明：我将一些其他内容更改为，以使其在小提琴上更有效地工作，您可以忽略我所做的其他更改。

您是对的，是用户：索引导致了此问题。您可以使用以下代码修复它

for(var i = 1; i < User.index; i++) {
    var key = "User:" + i;
    var entry = JSON.parse(localStorage[key]);
    console.log("entry : ", key, entry);
    ...

for（var i=1；i

---

我还建议不要以这种方式创建帐户（除非您有充分的理由），也可以使用类似jQuery的JavaScript库。

您可以向我们展示HTML并告诉我们您单击/键入的内容吗？也许在您在init方法中分配值之前，fiddle看起来也像是从本地存储中读取索引作为字段。您是否只尝试过读取已分配的值？因此您的init会首先将索引设置为1时间流逝。为什么要读取潜在的未定义值并向其添加1？@LoganMurphy@xDaevax不太确定您的意思，我应该在init方法之后为索引分配一个值……或者您可以给出一个示例吗？进一步调查后，您的循环似乎是问题的一部分。您的索引始终是n+1（由于

User:index

local storage条目），但在循环中您没有考虑这一事实。给定local storage+

User:index

中的3个元素，您的for循环中的迭代器限制将是4，在最后一个索引中给出了

未定义的

，因为localStorage[4]是

User:index

而不是一个用户条目，因此JSON解析将失败并给出未定义的结果。下一步投票人是否愿意解释原因以便我改进答案？localstorage中的键顺序可能不一定映射到循环的

I

变量，因此您可能永远无法通过

如果

。由于键是字母1、10、11、2、3、4、5…但我是数字1、2、3、4、5，可能有一些中间键，我明白你的意思。但是，就字母顺序而言，我所有的调试都显示这些项是按添加顺序存储的（所以数字很好）但是，如果一个项目存储在用户元素之间，那将是一个问题。这就是我懒惰和跳过正则表达式密钥检查所得到的结果。我将很快修改我的答案。

        for (var i = 0; i < localStorage.length; ++i) {
            var key = localStorage.key(i);
            var reg = new RegExp("User\:\\d+$");
            //Only process user entries
            if(reg.test(key)) {

                var value = localStorage[key];
                entry = JSON.parse(window.localStorage.getItem(key));
                console.log(entry.user_name);
                console.log(entry);
            } // end if
        }

for(var i = 1; i < User.index; i++) {
    var key = "User:" + i;
    var entry = JSON.parse(localStorage[key]);
    console.log("entry : ", key, entry);
    ...