时间戳

首页 > 解决方案 > 用新值替换 localStorage

javascript - 用新值替换 localStorage

问题描述

我正在将 localStorage 中的值作为嵌套数组读取，并且根据某些条件，我从读取的数组中删除了几个数组。要从主数组中删除数组，我使用以下函数：

Array.prototype.diff = function(a) {
    return this.filter(function(i) {return a.indexOf(i) < 0;});
};

结果数组小于原始嵌套数组。以下是我在 localStorage 中的原始数组：

var arr = `"["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",270,399,387,397,390,472,"STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",270,399,387,397,390,472,"STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",321,322,414,333,418,375]"`

//Function to drop rectangles
function dropRects() {
    dragging = false;
    mLocation = getCanvasCoordinates(event);
    var a = Math.floor(mLocation.x);
    var b = Math.floor(mLocation.y);
    var clickedImg = localStorage.getItem('clickedImage');
    var arr = new Array();
    var getCoords = getArray();
    if (typeof getCoords !== 'undefined' && getCoords.length > 0) {
      var allCoords = fourthCoord(getCoords);
      arr = multiDimensionalUnique(allCoords);

上面给出的示例数组arr是 `multiDimensionalUnique(allCoords);

      var results = new Array();
    //For each item in array, perform calculation to find the array that needs to be deleted and store the found array in results - This is working properly

      arr.forEach(function(d) {
        if (d[0] === clickedImg && d[3] < a && d[4] < b && d[5] > a && d[6] < b && d[7] > a && d[8] > b && d[9] < a && d[10] > b) {
          results.push(d)
        }
      });
    //delete the found array from master array.
      var newArr;
      newArr = arr.diff(results);

     //Delete the empty array [] from the master array
      var secArr;
      secArr = newArr.filter(function(x) { return (x !== (undefined || null || ''));})

      //Delete the last two elements from each array, so that it is exactly the same as array downloaded from localStorage
      for (var i = 0;i < secArr.length; i++) {
        secArr[i].splice(9,2);  
      }
      secArr = JSON.stringify(secArr) 
      console.log(secArr);
  } 
  localStorage.setItem('coords', secArr);
}

console.log(secArr)打印以下结果（新数组）：

[["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","FBB",270,406,377,396,381,469],["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",326,321,425,332,420,375],["STAR_SPORTS_2-20170924-200043-210917-00143.jpg","PerimeterBoard","Gillette",367,323,492,330,492,378]]

我不知道为什么我在这个数组的开头和结尾有一个额外的方括号。（如果此结果与上面给出的示例数据不同，请原谅我，因为这是来自我的实时仪表板）

该行localStorage.setItem('coords', secArr) 使用如下所示的新值重置 localStorage：

"[["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","FBB",270,406,377,396,381,469],["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",326,321,425,332,420,375],["STAR_SPORTS_2-20170924-200043-210917-00143.jpg","PerimeterBoard","Gillette",367,323,492,330,492,378]]"

再次使用前面和后面的方括号。

由于新数组嵌套在另一个数组中，当我再次读取 localStorage 时，我无法检索该数组。如何将secArr变量作为原始变量发布到 localStorage coords。

标签： javascriptarrays

解决方案

我怀疑您的回答是由于var arr声明中的双引号引起的。请看下面的代码：

arr = ["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",270,399,387,397,390,472,"STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",270,399,387,397,390,472,"STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",321,322,414,333,418,375];

Array.prototype.diff = function(a) {
    return this.filter(function(i) {return a.indexOf(i) < 0;});
};
clickedImg = true;

var results = new Array();
//For each item in array, perform calculation to find the array that needs to be deleted and store the found array in results - This is working properly

arr.forEach(function(d) {
  if (d[0] === clickedImg && d[3] < a && d[4] < b && d[5] > a && d[6] < b && d[7] > a && d[8] > b && d[9] < a && d[10] > b) {
    results.push(d)
  }
});
//delete the found array from master array.
var newArr;
newArr = arr.diff(results);

//Delete the empty array [] from the master array
var secArr;
secArr = newArr.filter(function(x) { return (x !== (undefined || null || ''));})

//Delete the last two elements from each array, so that it is exactly the same as array downloaded from localStorage
for (var i = 0;i < secArr.length; i++) {
  secArr[i].splice(9,2);  
}
secArr = JSON.stringify(secArr) 
console.log(secArr);

它产生 ["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","FBB",270,406,377,396,381,469],["STAR_SPORTS_2-20170924-200043-210917-00142.jpg","PerimeterBoard","Gillette",326,321,425,332,420,375],["STAR_SPORTS_2-20170924-200043-210917-00143.jpg","PerimeterBoard","Gillette",367,323,492,330,492,378]（注意数组中没有数组）。

推荐阅读