JavaScript的濾波器陣列

Question

我走線上的JavaScript課程和我很好奇的任務之一：

我們來抓設置有初始陣列（在破壞者函數的第一個參數），隨後是一個或更多的論據。我們必須從初始數組中刪除與這些參數具有相同值的所有元素。

這裏是我的解決方案，但它不工作：

function destroyer(arr) { 
 
    // Separating the array from the numbers, that are for filtering; 
 
    var filterArr = []; 
 
    for (var i = 1; i < arguments.length; i++) { 
 
    filterArr.push(arguments[i]); 
 
    } 
 

 
    // This is just to check if we got the right numbers 
 
    console.log(filterArr); 
 

 
    // Setting the parameters for the filter function 
 
    function filterIt(value) { 
 
     for (var j = 0; j < filterArr.length; j++) { 
 
     if (value === filterArr[j]) { 
 
      return false; 
 
     } 
 
     } 
 
    } 
 
    // Let's check what has been done 
 
    return arguments[0].filter(filterIt); 
 
} 
 

 
destroyer([1, 2, 3, 1, 2, 3], 2, 3);

我能夠找到一個解決方案，但它不使任何意義對我來說，這就是爲什麼我發佈這個問題;你能告訴我爲什麼下面的代碼工作：

function destroyer(arr) { 
 
    // Separating the array from the numbers, that are for filtering; 
 
    var filterArr = []; 
 
    for (var i = 1; i < arguments.length; i++) { 
 
    filterArr.push(arguments[i]); 
 
    } 
 

 
    // This is just to check if we got the right numbers 
 
    console.log(filterArr); 
 

 
    // Setting the parameters for the filter function 
 
    function filterIt(value) { 
 
     for (var j = 0; j < filterArr.length; j++) { 
 
     if (value === filterArr[j]) { 
 
      return false; 
 
     } 
 
     // This true boolean is what makes the code to run and I can't     // understand why. I'll highly appreciate your explanations. 
 
     } 
 
     return true; 
 
    } 
 
    // Let's check what has been done 
 
    return arguments[0].filter(filterIt); 
 
} 
 

 
destroyer([1, 2, 3, 1, 2, 3], 2, 3);

謝謝你的頭了！

Answer 1

你的代碼不工作，因爲你沒有返回true。

Array.filter需要一個布爾值作爲返回值。如果true，它將添加到結果數據集。如果false，會跳過。

由於您未返回任何內容，因此它將返回undefined作爲默認設置，並且undefined爲falsey。因此你的返回數組將是空白的。

作爲每MDN，

濾波器（），用於在一個陣列的每個元素調用提供的回調函數一次，並構造的所有值的一個新的數組，回調返回，它可以強制爲真的值。

Answer 2

filter是一個數組本地函數。它創建一個包含所有通過給定測試的元素的新數組。測試函數必須返回一個布爾值，如果true該值沒有被濾除，並且如果false，它被過濾掉。

經過文檔： Filter- Array

您已經發布的正確的解決方案，具有用於過濾給定數組，返回true和false，具體使用情況下（在這裏是邏輯有效的測試功能消除作爲參數提供的數字）。

你實現遺漏返回true（這是返回undefined，在Javscript一個falsey值，因此所有的值被過濾掉，你會得到一個空數組

注：true這裏指的是所有truthy JS和false中的值是指JS中的所有falsy值。

Answer 3

閱讀Rajesh寫的內容，很容易理解filter()的工作原理。

此外，您實際上並不需要輔助功能。 這段代碼是綽綽有餘：
編輯：甚至更​​少的代碼由拉傑什

function destroyer(arr) { 

    for (var i = 1, filterArr = []; i < arguments.length; i++) { 
    filterArr.push(arguments[i]); 
    } 

    return arguments[0].filter(function(v) { 
    return filterArr.indexOf(v)===-1 
    }); 
} 

var result = destroyer([1, 2, 3, 1, 2, 5, 3], 2, 3); 
console.log(result); 

Answer 4

建議的過濾器回調必須返回一個布爾值，要麼保留元素或刪除它真真切切的說該值通過了您的支票。

濾波器原型的詳細描述可以在這裏找到。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

Answer 5

你可能會利用Array.prototype.reduce()如下相對簡單的代碼做同樣的工作;

ES6

var destroyer = (a,...f) => a.reduce((p,c) => f.includes(c) ? p : p.concat(c),[]); 
 
console.log(destroyer([1, 2, 3, 1, 2, 3], 2, 3));

或ES5

function destroyer(a){ 
 
    var f = Array.prototype.slice.call(arguments,1); 
 
    return a.reduce(function(p,c){ 
 
        return f.indexOf(c) !== -1 ? p : p.concat(c); 
 
        },[]); 
 
} 
 
console.log(destroyer([1, 2, 3, 1, 2, 3], 2, 3));