Question

我想知道如何解决匹配/查找问题，我“认为”多维数组是解决方案。简而言之，我希望将存储为cookie值的逗号分隔SKU列表与具有匹配产品名称的有限SKU列表进行匹配，并将匹配的产品名称打印到页面上。我不确定这是否是最好的方法，但是到目前为止，我还不清楚如何从cookie中正确分解逗号分隔的字符串（现在它正在尝试匹配整个cookie值），将它们与矩阵匹配（总共17行），然后打印出产品名称。

<script>
var staticList = [
 [“1234”, “Chocolate Ice Cream”],
 [“1235”, “Peanut Butter Cookie”],
 [“6G2Y”, “Raspberry Jell-O”],
 [“YY23”, “Vanilla Wafers”]
];
var cookieSkus = [‘1235,YY23’];  // comma separated value from cookie

jQuery(function () {
 for (var i = 0; i < staticList.length; i++)  {
   if (cookieSkus.indexOf(staticList [i][0]) > -1) {
    jQuery('#pdisplay).append(staticList [i] [1] + '<br />');
   }
 }
});

</script>

<p id=”pdisplay”></p>

在这个例子中，段落＆＃34; pdisplay＆＃34;将包含：

花生酱饼干
香草威化饼

有没有办法纠正我上面的内容，或者有更好的方法来完成我想要做的事情？

Answer 1

首先，您可能希望专注于Cookie SKU而不是staticList。这样做的原因是cookie可能具有可变数字，并且可能小到0个元素。（毕竟，如果没有物品，我们不需要列出物品）。

这可以通过将字符串转换为数组然后检查SKU是否在staticList中来完成。不幸的是，由于您使用的是多维数组，因此需要为每个cookie sku执行staticList。仅使用此建议，这是一个基本示例fiddle：

重写：考虑到staticList是一个数组数组

jQuery(function() {
    var skus = cookieSkus[0].split(',');
    for (var i = 0; i < skus.length; i++) {
        for (var j = 0; j < staticList.length; j++) {
            if (staticList[j][0] == skus[i]) {
                jQuery('#pdisplay').append(staticList[j][2] + '<br/>');
                break; // Will end inner if the item is found... Saves a lot of extra time.
            }
        }
    }
});

编辑2：使用对象（可能更好的方法）

根据评论，您必须支持IE8。在这种情况下，您可以考虑使用Object而不是多维数组。原因如下：

一个对象实际上是一个关联数组（有一些特权）。
您可以在没有任何嵌套数组的情况下直接检查属性是否存在。
对象属性访问通常比循环遍历数组
您几乎可以像访问数组的元素一样访问对象属性。

使用Object时，可以不经修改地使用我的代码的原始版本。这是因为对象的结构更简单。这是一个小提琴：option 2

var staticList = {
    "1234": "Chocolate Ice Cream",
    "1235": "Peanut Butter Cookie",
    "6G2Y": "Raspberry Jell-O",
    "YY23": "Vanilla Wafers"
};

jQuery(function() {
    var skus = cookieSkus[0].split(',');
    for (var i = 0; i < skus.length; i++) {
        if (staticList[skus[i]]) 
            jQuery('#pdisplay').append(staticList[skus[i]] + '<br/>');
    }
});

回复您的评论：

输出匹配所需的原因是因为与具有数字索引的数组不同，对象的索引是实际的skus。因此，如果staticList[0]是一个对象，则没有staticList。相反（在staticList对象的上下文中），1234 =“巧克力冰淇淋”。因此，对象定义基本如下：

var objectName = {
    index1: value1,
    index2: value2,
    ...,
    ...
}

索引可以是任何原始值（整数或字符串）。该值可以是包括函数或内部对象的任何有效javascript值。现在，要获取特定索引的值，您可以执行以下任一操作：

objectName.index1 (no quotes)

OR：

objectName["index1"] (quotes needed if the index is a string)

其中任何一个的结果都是：

value1

就这么简单。

Answer 2

我会尝试这样的事情：

var cookieSkus = cookieSkus[0].split(',');

staticList.filter(function(cell){
     return  cookieSkus.some(function(val){return cell[0] === val; });   
 }).map(function(cell){
       jQuery('#pdisplay).append(cell[1] + '<br />');
    });

免责声明：根据上面提供的示例代码以及最近的评论提供

匹配数组到JavaScript矩阵

2 个答案: