javascript - for 循环错误，需要帮助解决

Question

我有这个 .click 函数，我将在其中检索 cookie 信息(其中包含 3 个具有多个元素的索引)

供您引用我的意思的示例

array= { name:"sam" surname:"tan" } { name:"jam" surname:"man" } { name:"gam" surname:"wan" }

所以我通过将其解析为变量来调用它然后我创建了另一个新变量，并执行 if, else 函数将元素过滤到新数组中，因为我的 .click 函数是检查是否有人修改其姓名/姓氏，然后按更新按钮，这就是我的原因听.click，我的代码比较多，所以只截取部分供引用

$('#update').click(function(){
                        clickedProfile.surname = $("input[name=contact-surname]").val();
                        clickedProfile.name = $("input[name=contact-name]").val();
                        clickedProfile.gender = $("input[name=contact-gender]").val();
                        $("#contact-surname").text('Surname is ' + $("input[name=contact-surname]").val());
                        $("#contact-name").text('Name is ' + $("input[name=contact-name]").val());
                        $("#contact-gender").text('Gender is ' + $("input[name=contact-gender]").val());

                        var c = JSON.parse($.cookie('cookiecontact'));
                        var d = [];

                        for(var i = 0; i < c.length; i++)
                        {
                            if(globalID == i)
                            {
                                d.push(clickedProfile); // in array, for that element it will store in the updated value
                            }
                            else
                            {
                                d.push(c[i]); // push in remaining non affected indexes into array
                            }
                        }

                        d.sort(function(a, b){
                            return a.name.localeCompare(b.name)
                        });

                        $.cookie('cookiecontact', JSON.stringify(d));
                        console.log($.cookie('cookiecontact'));
                    });

我将出于我的目的解释代码

clickedProfile.surname = $("input[name=contact-surname]").val();
clickedProfile.name = $("input[name=contact-name]").val();
clickedProfile.gender = $("input[name=contact-gender]").val();

我在另一个函数上声明了 clickProfile，它将附加 LI 列表的唯一 ID，因此，如果我的点击位于第一个 LI，clickProfile 将附加一个 LI ID = 0，链接到数组[0 ] 元素。

因此，对于我的 for 循环，如果单击 LI，if 语句将运行以将更新的代码推送到联系人数组中索引的元素

如果其余索引元素与我单击的全局ID不匹配，它将继续将其余索引元素插入 var D 中。

当我刷新页面以获取更新的列表时，

示例:开始是我的主 li 表单仅显示联系人数组中每个索引的名称值

山姆

果酱

加姆

第一次尝试将 sam 更改为 zam 时，它运行良好，输出

果酱

加姆

扎姆

第二次我尝试将 zam 更改为 cam 时，它会开始表现出奇怪的输出

摄像头

摄像头

果酱

第三次尝试更改果酱以禁止后，它将变成

禁止

禁止

禁止

我不知道是什么原因造成的，因为每次我按更新后它似乎都会更改额外的一个索引。

到目前为止，我的函数逻辑是

1. 从cookie中检索值(cookie有3个预设元素字符串)
2. 过滤成一个新变量，如果全局id ==匹配，则放入更新后的变量该元素中的信息，同时插入加载的其余部分元素
3. 按字母顺序排序
4. 存储到cookie中
5. 转到另一个页面并返回以检查更新的列表

到目前为止，我认为我的逻辑没问题，但不确定我哪里做错了。请指出我的错误，谢谢!

Answer 1

这个数组排序算法可能是罪魁祸首。

d.sort(function(a, b){
    return a.name.localeCompare(b.name)
});

当您按名称对数组进行排序时，您的数组索引不再与您的全局ID 匹配。然后，下次单击时，Cookie 数组中的错误项目将被替换。

这是一个工作版本 http://jsfiddle.net/F8RvB/ :

var clickedProfile = {};
var globalID = 0;
var cookieContact = [{ name:"one" ,surname:"oner", gender:"male", id:0 }, { name:"two", surname:"twoer", gender: "male", id:1 }, { name:"three", surname:"threer" , gender: "male", id:2}];

$('#update').click(function(){

clickedProfile.surname = $("input[name=contact-surname]").val();
clickedProfile.name = $("input[name=contact-name]").val();
clickedProfile.gender = $("input[name=contact-gender]").val();
clickedProfile.id = globalID;
$("#contact-surname").text('Surname is ' + $("input[name=contact-surname]").val());
$("#contact-name").text('Name is ' + $("input[name=contact-name]").val());
$("#contact-gender").text('Gender is ' + $("input[name=contact-gender]").val());

var c = cookieContact;
var d = [];

for(var i = 0; i < c.length; i++)
{
    if(globalID == i)
    {
        d.push(clickedProfile); // in array, for that element it will store in the updated value
    }
    else
    {
        d.push(c[i]); // push in remaining non affected indexes into array
    }
}

d.sort(function(a, b){
    return a.id > b.id;
});

cookieContact = d;
console.log(cookieContact);
});

为了简单起见，我删除了 cookie 函数，只是将其替换为硬编码的 POJO 数组。不确定为什么要对数组进行排序...在此处的工作示例中，您可以完全删除排序。否则，当您从 cookie 中获取数据以便稍后使用时，您应该考虑进行排序，或者根据排序后的数组索引更新您的 globalID。