將對象連接成數組

var groupArrays = { 
    "group1" : [ 
     "volvo", 
     "bmw", 
     "audi" 
    ], 
    "group2" : [ 
     "red" 
    ], 
    "group3" : [ 
     "1991" 
    ] 
};

此對象是在過濾汽車列表後創建的，我想創建一些用於在javascript中使用的css選擇器來顯示過濾的元素。所以基本上我要的是有可能選擇一個陣列，這樣的事情：將對象連接成數組

var selectors = [".volvo.red.1991", ".bmw.red.1991", ".audi.red.1991"];

什麼是這裏最簡單的方法來創建selectors數組，如果組的數量是未知的？

來源

2014-03-06 halliewuud

您需要向我們展示更多數據才能瞭解分組模式是什麼。如果group2或group3中有多個項目，可以做什麼？目前尚不清楚該算法將用於構建選擇器。你只是試圖建立所有可能的組合1，組2和組3？ – jfriend00

繼續思考：如果用戶沒有選擇任何品牌，該怎麼辦？我不認爲你的問題可以通過幾個嵌套循環來優雅地解決。如果我們考慮濾波器設計：爲什麼我們需要選擇三次「1991」或「紅色」？ –

var groupArrays = { 
    "group1": [ 
     "volvo", 
     "bmw", 
     "audi" 
    ], 
    "group2": [ 
     "red" 
    ], 
    "group3": [ 
     "1991" 
    ] 
}; 

var selectors = []; 
var selector; 

for (var g1 = 0; g1 < groupArrays.group1.length; g1++) { 
    for (var g2 = 0; g2 < groupArrays.group2.length; g2++) { 
     for (var g3 = 0; g3 < groupArrays.group3.length; g3++) { 
      selector = "." + groupArrays.group1[g1] + 
         "." + groupArrays.group2[g2] + 
         "." + groupArrays.group3[g3]; 
      selectors.push(selector); 
     } 
    } 
} 

console.log(selectors);

JS Fiddle

爲任意數量的組

var groupArrays = { 
    "group1": [ 
     "volvo", 
     "bmw", 
     "audi" 
    ], 
    "group2": [ 
     "red","green" 
    ], 
    "group3": [ 
     "1991","1992" 
    ] 
}; 

var selectors = []; 
var values = []; 
var ga = []; 

for (var group in groupArrays) { 
    ga.push(groupArrays[group]); 
} 

traverse(ga, 0); 

console.log(selectors); 

function traverse(ga, index) { 
    if (index >= ga.length) { 
     selectors.push("." + values.join(".")); 

     return; 
    } 

    var hold = ga[index].slice(0); 
    var gacopy = ga[index]; 

    while(gacopy.length > 0) { 
     var pickedValue = gacopy[gacopy.length - 1]; 
     values.push(pickedValue); 
     gacopy.pop(); 

     traverse(ga, index + 1); 

     values.splice(values.indexOf(pickedValue), 1); 
    } 

    ga[index] = hold; 
}

的更新代碼

JS Fiddle

來源

2014-03-06 21:38:52

羣組數量未知 – halliewuud

@halliewuud，查看更新的代碼。 –

只是一個簡單的嵌套循環系列會做到這一點。不過，您可能會遇到類別1991以某個數字開頭的問題。

var selectors = []; 
var i = groupArrays.group1.length, 
    j, 
    k; 
while (i--) { 
    j = groupArrays.group2.length; 
    while (j--) { 
     k = groupArrays.group3.length; 
     while (k--) { 
      selectors.push(
       '.' + groupArrays.group1[i] + 
       '.' + groupArrays.group2[j] + 
       '.' + groupArrays.group3[k] 
      ); 
     } 
    } 
} 
selectors; // [".audi.red.1991", ".bmw.red.1991", ".volvo.red.1991"]

如果你有一個未知的數量在groupArrays的項目，您可能需要for..in遍歷它，並用所得鍵遞歸。

來源

2014-03-06 21:37:01

羣組數量未知 – halliewuud

可以使用map功能

var selectors = []; 
groupArrays["group1"].map(function(x) { 
    groupArrays["group2"].map(function(y) { 
     groupArrays["group3"].map(function(z) { 
        selectors.push('.' + x + '.' + y + '.' + z)})})});

來源

2014-03-06 21:44:11 slapthelownote

組數量未知 – halliewuud

將對象連接成數組

回答

相關問題