如何在JavaScript數組中查找元素的所有組合

Question

我有以下數組：

[A，1，X]，[B，2，Y]，[C，3，Z]]

我希望能夠獲得每個子數組的第一個索引的所有組合，然后遍歷在每個組合上執行單個任務的那些組合。 因此，這些是我想要的組合（請注意，我也需要相同值的組合）：

[A，A]，[A，B]，[A，C]，[B，A]，[B，B]，[B，C]，[C，A]，[C，B]，[ C，C]]

然后，我將遍歷該循環並對每個值進行一些處理。

我不知道從哪兒開始，所以任何建議或指示都將真正有用！

Answer 1

您需要有效地遍歷數組兩次。 根據您的需要，您可以每次靜態訪問第一個元素：

var arr = [['A',1,'X'],['B',2,'Y'],['C',3,'Z']];
var newArr = [];
var length = arr.length;
var curr;

for (var i = 0; i < length; i++) {
    curr = arr[i][0];

    for (var j = 0; j < length; j++) {
        newArr.push([curr, arr[j][0]]);
    }
}

console.log(newArr);

小提琴

Answer 2

嘗試這個：

var data = [['A',1,'X'],['B',2,'Y'],['C',3,'Z']];

function getCombinations(data) {
    var combinations = [];
    data.forEach(function(first) {
        data.forEach(function(second) {
            combinations.push([first[0], second[0]]);
        });
    });
    return combinations;
}

console.log(getCombinations(data));

這是jsfiddle-demo

Answer 3

讓我們分解問題。 首先，讓我們提取每個子數組的第一個元素：

function get_elts(data, idx) {
    return data.map(function(v) { return v[idx]; });
}

所以

> get_elts(data, 0) // ['A', 'B', 'C']

分解這樣的問題是良好程序設計的基礎。 我們不想寫會混淆多個問題的東西。 在這種情況下，多個問題是（1）獲取每個子數組的第一個元素，以及（2）找到組合。 如果我們編寫一個混合了兩個問題的例程，那么我們將永遠無法將其重用於其他用途。 如果老板來了，說現在他想找到每個子數組的第二個元素的所有組合，我們將不得不剪切並粘貼並創建幾乎重復的代碼。 然后，我們將在余下的生命中或至少在退出之前保持該代碼。 有關分解的規則是盡早進行，而不要遲進行。

然后，創建任何兩個數組的所有組合：

function combinations(arr1, arr2) {      //create all combos of elts in 2 arrays by
    return [].concat.apply(              //concatenating and flattening
        [],                              //(starting with an empty array)
        arr1.map(                        //a list created from arr1  
            function(v1) {               //by taking each elt and from it
                return arr2.map(         //creating a list from arr2
                    function(v2) {       //by taking each element and from it
                        return [v1, v2]; //making a pair with the first elt
                    }
                );
            };
        )
    );
}

通常，我們會更緊湊地編寫此代碼。 讓我們來看一下：

1. Array#concat將一個或多個事物或這些事物中的元素（如果是數組）組合到一個數組中。
2. Function#apply讓我們提供一個數組，該數組將變為concat的參數列表。
3. Array#map為arr1創建一個並行數組，其中包含...
4. 元素是基於在arr2上循環的兩元素數組。

是的，這不是您母親的JavaScript。 這與初始化樣式，設置樣式並在其他內容上循環並返回其他內容的風格幾乎是另一種語言。 通過采用這種樣式，我們最終得到的代碼將更加精確，簡明，可重用，可證明正確，對未來友好，甚至可以被優化。

對於未來友好，我的意思是對ES6友好。 以上內容可以重寫為：

combinations = (arr1, arr2) => [].concat(...arr1.map(v1 => arr2.map(v2 => [v1, v2])));

准備好男孩和女孩，這很快就會出現在您的工作面試中。 是時候從jQuery開始了。

現在問題可以表示為：

var first_elts = get_elts(data, 0);
combinations(first_elts, first_elts);