개체를 배열에 연결

Question

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

이 개체는 자동차 목록을 필터링 한 후에 만들어지며, 필터링 된 요소를 표시하기 위해 javascript에서 사용할 CSS 선택기를 만들고 싶습니다.

이 그룹의 수를 알 수없는 경우 selectors 배열을 만들려면 여기 가장 쉬운 방법은 무엇입니까

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

: 그러니까 기본적으로 내가 원하는 것은이 같은 수 선택기와 배열, 뭔가입니까?

Answer 1

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

Answer 2

단순한 일련의 중첩 루프가이를 수행합니다. 하지만 클래스의 숫자로 시작하는1991 클래스에 문제가있을 수 있습니다. 당신이 groupArrays 항목의 알 수없는 번호가있는 경우

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"] 

, 당신은 그것을 통해 for..in 루프가 필요하고 그 결과 키 재귀 수 있습니다.

Answer 3

당신은 map 기능을 사용할 수 있습니다

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