javascript - 我疯了还是本地存储......？

Question

我的目标:通过删除以前使用过的项目来清理本地存储 for循环。

通常，我有很多项目，如下所示:

order-1356666288243 => {"cartID":2713329701836,"productName"...
order-1356666288243 => {"cartID":2713329701836,"productName"...

当我检查总共有多少个项目时，我得到了正确的从零开始的金额:

console.log( localStorage.length );

即使我做了 for loop写出键和值，以及 console.log()其他一些事情，一切都很好:

for(var i=0, len=localStorage.length; i<=len; i++) {

    var key = localStorage.key(i);
    var value = localStorage[key];
    console.log(key + " => " + value);


        if(key != '' && key != null){

            console.log( key.indexOf('order-') );
            console.log(i + '. Key: ', key);

            if(key.indexOf('order-') != -1){
                console.log('The key to be removed is: ', key.toString());
                localStorage.removeItem(key.toString());
            }
       }

    console.log(i + ': ' + len);
}

一切都几乎符合人们的预期。但是，当我运行脚本时，此行仅执行一次:

localStorage.removeItem(key);

或

localStorage.removeItem(key.toString());

事实上，我必须运行整个脚本的次数与项目的数量一样多。因此，如果我有 3 个项目，我需要运行循环 3 次才能删除每个项目。

我很困惑:我哪里做错了？所有console.log() stuff 显示了 3 次(如果我有 3 个项目并运行 for loop 一次)。出于绝望，我什至改变了i < len至i >= len ，但这也不能解决问题。

有人吗？

Answer 1

问题在于您在遍历集合时正在修改它。执行此操作时请务必小心。

在这种特殊情况下，当您删除项目时，localStorage 的长度会发生变化，因此您最终会跳过项目。

您应该localStorage向后遍历(最后一项到第一项)，或者更好的是您应该分两遍执行此操作:一次通过收集要删除的 key ，以及另一遍删除它们:

Object.keys(localStorage)
.filter(function(key){return key.indexOf('order-')===0})
.forEach(localStorage.removeItem, localStorage);

或者如果您需要它在 IE8 或 FF3.x 中工作:

var delkeys = [], key, i, len;
for (i=0,len=localStorage.length; i<len, key=localStorage.key(i); i++) {
    if (key.indexOf('order-')===0) {
        delkeys.push(key);
    }
}
for (i=0,len=delkeys.length; i<len, key=delkeys[i], i++) {
    localStorage.removeItem(key);
}