JavaScript 從數組中刪除所有出現的值

Question

我正在使用下面的代碼片段從數組中刪除所有出現的值（即在這種情況下為 97）。 我無法理解為什么輸出數組中的值為 97。 當我刪除 32 時，它會從數組中刪除所有 32。 與 6 相同。這里的 97 有什么問題？ 對我來說有點奇怪。 （我在想可能是 97 沒有正確輸入或什么的）。

 var inputArr = [3, 97, 32, 6, 97, 2, 9,32, 1, 32, 97, 97, 6, -1, 5]; function removeItem(array, item) { for(i = 0; i<array.length; i++){ if(array[i] == item) { array.splice(array.indexOf(item), 1); } } } removeItem(inputArr, 97); removeItem(inputArr, 32); removeItem(inputArr, 6); document.getElementById("output").innerHTML = inputArr;

 <p id="output"></p>

Answer 1

問題與兄弟 97s - 1, 32, 97, 97, 6 。 當您按此順序拼接前 97 個時，下一個 97 將更改其索引並進入第一個。 但變量i正在跟蹤該項目。

刪除項目時，通過--i減少索引。

你也可以通過filter功能來做到這一點。 這將創建一個新數組，您只需要返回它。 在這里，我創建了一個帶有input數組的對象和一個過濾input並返回當前對象的函數。 這將使您能夠級聯我認為代碼風格中很漂亮的功能，並且可以在某些方面為您提供幫助。

 const obj = { input: [3, 97, 32, 6, 97, 2, 9,32, 1, 32, 97, 97, 6, -1, 5], removeItem(item) { this.input = this.input.filter(i => i !== item); return this; } } const output = obj.removeItem(97) .removeItem(32) .removeItem(6); console.log(output.input);

Answer 2

當您改變數組並在拼接時增加索引時，您可以采用另一種方法並從數組的末尾開始。 這意味着以下項目仍以其原始索引可用，並且可以在必要時進行檢查和拼接，而不會留下一些未拼接的值。

 function removeItem(array, item) { var i = array.length; while (i--) { if (array[i] === item) { array.splice(array.indexOf(item), 1); } } } var inputArr = [3, 97, 32, 6, 97, 2, 9, 32, 1, 32, 97, 97, 6, -1, 5]; removeItem(inputArr, 97); removeItem(inputArr, 32); removeItem(inputArr, 6); console.log(inputArr);

Answer 3

當您刪除一個元素時，您還必須減少i的值。

為什么這個？

因為splice方法改變了數組的內容，元素的索引也改變了。 因此，當您需要從數組中remove連續的97元素時，您必須減小i的值。

當您從數組中刪除前 97 個元素時，下一個 97 個元素會更改它的索引，但i一直在增加。

 var inputArr = [3, 97, 32, 6, 97, 2, 9,32, 1, 32, 97, 97, 6, -1, 5]; function removeItem(array, item) { for(i = 0; i<array.length; i++){ if(array[i] == item) { array.splice(array.indexOf(item), 1); i--; } } } removeItem(inputArr, 97); removeItem(inputArr, 32); removeItem(inputArr, 6); document.getElementById("output").innerHTML = inputArr;

 <p id="output"></p>

為了更簡單的解決方案，您可以通過將callback函數作為參數傳遞來使用filter方法。

 var inputArr = [3, 97, 32, 6, 97, 2, 9,32, 1, 32, 97, 97, 6, -1, 5]; function removeItem(array, item) { return array.filter(i => i !== item); } inputArr = removeItem(inputArr, 97); inputArr = removeItem(inputArr, 32); inputArr = removeItem(inputArr, 6); console.log(inputArr);

Answer 4

使用過濾器

const newArray = inputArr.filter(element => ![97, 32, 6].includes(element));

filter作用是創建一個新array 。 要確定新array應該包含什么，它需要遍歷舊數組中的每個element ，如果我們對當前element返回true ，則將其添加到新array 。

element => ![97, 32, 6].includes(element)意味着我們正在詢問array [97, 32, 6]是否具有當前element的值。 既然我們不想把它添加到列表中，那么我們寫! 在隊伍前面，因為我們希望相反的情況發生。

Answer 5

有點棘手

因此，當您匹配時，您會執行 splice()，因此第 (i+1) 個元素來到 i。 但是下一次迭代從 i+1 開始，所以它不匹配第 i 個元素（即第 i+1 個元素）。

這里最后兩個 97 是連續的，因此只有 1 匹配。

試試這個 -

function removeItem(array, item) {
    for(i = 0; i<array.length; i++){
        if(array[i] == item) {
            array.splice(array.indexOf(item), 1);
            i--;
        }
    }
}

Answer 6

拼接后，您必須將 i 減為 1。

array.splice(array.indexOf(item), 1);
i--;

Answer 7

問題是您在執行for-loop時進行了修改，元素的索引也被修改了。

更好的方法是使用.filter()函數。

看看這個代碼片段

 var inputArr = [3, 97, 32, 6, 97, 2, 9, 32, 1, 32, 97, 97, 6, -1, 5]; function removeItem(array, item) { return array.filter((i) => i !== item); } inputArr = removeItem(inputArr, 97); inputArr = removeItem(inputArr, 32); inputArr = removeItem(inputArr, 6); document.getElementById("output").innerHTML = inputArr;

 <p id="output"></p>

看到了嗎？ 數組被過濾。

資源

• Array.prototype.filter()

Answer 8

這是 ES5 版本，運行速度更快，尤其是在數組稀疏時

 function removeAll( array, item ) { for (var i = 0; (i = array.indexOf(item, i)) >= 0; array.splice(i, 1)); } var inputArr = [3, 97, 32, 6, 97, 2, 9, 32, 1, 32, 97, 97, 6, -1, 5]; removeAll(inputArr, 97); removeAll(inputArr, 32); removeAll(inputArr, 6); console.log(inputArr);

Answer 9

你應該加我——像這樣

var inputArr = [3, 97, 32, 6, 97, 2, 9, 32, 1, 32, 97, 97, 6, -1, 5];

function removeItem(array, item) {
    for (i = 0; i < array.length; i++) {
        if (array[i] == item) {
            array.splice(array.indexOf(item), 1);
            i--;
        }
    }
}
removeItem(inputArr, 97);
removeItem(inputArr, 32);
removeItem(inputArr, 6);

document.getElementById('output').innerHTML = inputArr;