將循環重寫為filter（）javascript

Question

我有以下JavaScript代碼：

var selectEnabledGenerators = function(generators) {
    //List of generator indexes to show
    var list = generators;
    var allGenerators = $(".generatorContainer");
    //Hide all generators
    allGenerators.hide();
    //maybe use filter here?
    for (var i = 0, max = list.length; i < max; i++) {
        $(".generatorContainer[data-generator=" + list[i] + "]").show();
    }
};

有什么方法可以使用filter()重寫for循環嗎？ 我知道我可以for each循環使用a for each但是我想通過使用filter來做到這一點。

Answer 1

此處無需使用filter 。 由於您不為forEach返回任何內容，因此它是更合適的功能。

應該遵循以下步驟：

list.forEach(item => $(".generatorContainer[data-generator=" + item + "]").show());

要么

list.forEach(function(item){
    $(".generatorContainer[data-generator=" + item + "]").show();
});

如果您不喜歡/不能使用lambdas

---

我還能使用過濾器嗎

是。 但是，實際上沒有理由這么做。 如果我看到您以這種方式使用過濾器，我將拒絕您的代碼審查。

過濾器的用例是通過傳入謂詞函數（一個回答“是否保留”的函數）來快速縮減項目列表。 Array<T>此函數的類型為T => boolean 。 此過濾器函數將在每個項目上執行謂詞函數的代碼塊，然后檢查該謂詞函數的返回值。 如果該返回值是真實的，它將標記傳遞給謂詞函數的對象，然后將所有導致產生真實值的對象作為新數組返回。 forEach還將對每個參數執行一個函數，而無需執行返回值和管理新列表的額外工作。

如果您不使用過濾器返回的結果，則使用過濾器是沒有意義的。 它不僅沒有用，而且還會使將來試圖閱讀您的代碼並試圖理解為什么在這里使用過濾器的人們感到困惑。

最終，代碼是相同的：

list.filter(item => $(".generatorContainer[data-generator=" + item + "]").show());

.show()被視為副作用（過濾器功能實際上不應該具有 ）。

Answer 2

您可以這樣使用.filter() ：

allGenerators.filter(function () {
    return list.indexOf(+$(this).attr('data-generator')) > -1
}).show();

簡化的演示：

 $('div').hide().filter(function (i) { return [1,3].indexOf(+$(this).attr('data-generator')) > -1 }).show(); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div data-generator=1>test1</div> <div data-generator=2>test2</div> <div data-generator=3>test3</div> <div data-generator=4>test4</div>