在使用.each（）函數後刪除對象數組中的重複值

Question

我有一個each函數，它將html table的td元素放置在對象數組中。我的問題是我只需要表格中的唯一值。這導致我的數組有重複的值。理想情況下，我希望看到Product和valProduct的唯一值。 。valProduct在本質上是一樣的「Product`這裏是我的關閉嘗試：

var array_return = []; 
 

 
$(".table__product td:nth-child(1)").each(function() { 
 
    array_return.push({ 
 
    "Product": $(this).html(), 
 
    "valProduct": $(this).html() 
 
    }); 
 
}); 
 

 

 
array_return.sort(function(a, b) { 
 
    return a.Product - b.Product; 
 
}); 
 

 
// delete all duplicates from the array_return 
 
for (var i = 0; i < array_return.length - 1; i++) { 
 
    if (array_return[i].Product == array_return[i + 1].Product) { 
 
    delete array_return[i]; 
 
    } 
 
} 
 

 
// remove the "undefined entries" 
 
array_return = array_return.filter(function(el) { 
 
    return (typeof el !== "undefined"); 
 
}); 
 

 
alert(JSON.stringify(array_return));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/core.js"></script> 
 

 

 
<table class="table__product"> 
 
    <tr> 
 
    <td>Apple</td> 
 
    <td>3384</td> 
 
    <td>iPhone</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Samsung</td> 
 
    <td>8800</td> 
 
    <td>Galaxy</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LG</td> 
 
    <td>8684</td> 
 
    <td>V20</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Google</td> 
 
    <td>8179</td> 
 
    <td>Pixel</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Blackberry</td> 
 
    <td>4554</td> 
 
    <td>Storm</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Motorolla</td> 
 
    <td>6764</td> 
 
    <td>Z force</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LEASING_REVENUE</td> 
 
    <td NOWRAP align=RIGHT>-2100000</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LEASING_REVENUE</td> 
 
    <td NOWRAP align=RIGHT>-2095011</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LEASING_REVENUE</td> 
 
    <td NOWRAP align=RIGHT>-2095010</td> 
 
    </tr> 
 
    <tr> 
 
    <td>ECS/ACH</td> 
 
    <td align=RIGHT>4493</td> 
 
    </tr> 
 
    <tr> 
 
    <td>ECS/ACH</td> 
 
    <td align=RIGHT>4494</td> 
 
    </tr> 
 
    <tr> 
 
    <td>ECS/ACH</td> 
 
    <td align=RIGHT>4495</td> 
 
    </tr> 
 
</table>

Answer 1

該錯誤是因爲兩件事情引起的：

1. 數組排序的價值沒有在for循環通過刪除密鑰分配回任何地方
2. 要修改的陣列

您需要做的是在for循環中定義一個新陣列，而不是修改原始陣列，然後將新陣列指定給原始陣列。

請看下面的代碼爲例：

var array_return = []; 
 
var filtered_array = []; 
 
var filtered_array_keys = []; 
 

 
$(".table__product td:nth-child(1)").each(function() { 
 
    array_return.push({ 
 
    "Product": $(this).html(), 
 
    "valProduct": $(this).html() 
 
    }); 
 
}); 
 

 
// delete all duplicates from the array_return 
 
for (var i = 0; i < array_return.length - 1; i++) { 
 
    if (filtered_array_keys.indexOf(array_return[i].Product) < 0) { 
 
    filtered_array_keys.push(array_return[i].Product); 
 
    filtered_array.push(array_return[i]); 
 
    } 
 
} 
 
array_return = filtered_array; 
 

 
// remove the "undefined entries" 
 
array_return = array_return.filter(function(el) { 
 
    return (typeof el !== "undefined"); 
 
}); 
 

 
alert(JSON.stringify(array_return));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="http://underscorejs.org/underscore-min.js"></script> 
 
<table class="table__product"> 
 
    <tr> 
 
    <td>Apple</td> 
 
    <td>3384</td> 
 
    <td>iPhone</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Samsung</td> 
 
    <td>8800</td> 
 
    <td>Galaxy</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LG</td> 
 
    <td>8684</td> 
 
    <td>V20</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Google</td> 
 
    <td>8179</td> 
 
    <td>Pixel</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Blackberry</td> 
 
    <td>4554</td> 
 
    <td>Storm</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Motorolla</td> 
 
    <td>6764</td> 
 
    <td>Z force</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LEASING_REVENUE</td> 
 
    <td NOWRAP align=RIGHT>-2100000</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LEASING_REVENUE</td> 
 
    <td NOWRAP align=RIGHT>-2095011</td> 
 
    </tr> 
 
    <tr> 
 
    <td>LEASING_REVENUE</td> 
 
    <td NOWRAP align=RIGHT>-2095010</td> 
 
    </tr> 
 
    <tr> 
 
    <td>ECS/ACH</td> 
 
    <td align=RIGHT>4493</td> 
 
    </tr> 
 
    <tr> 
 
    <td>ECS/ACH</td> 
 
    <td align=RIGHT>4494</td> 
 
    </tr> 
 
    <tr> 
 
    <td>ECS/ACH</td> 
 
    <td align=RIGHT>4495</td> 
 
    </tr> 
 
</table>

Answer 2

我想你可能會更好複製獨特的項目到一個新的陣列，而不是使用循環您正在使用的問題與這部分代碼：

for (var i = 0; i < array_return.length - 1; i++) { 
    if (array_return[i].Product == array_return[i + 1].Product) { 
    delete array_return[i]; 
    } 
} 

在於： 1）當從數組中刪除項目（說在索引3）項在索引4的項變爲項目3蒲式耳。那麼當你在循環中增加i時，它將檢查索引4（它曾經是索引5）並且索引4永遠不會被檢查。我會重寫那樣的：

var newArray = []; 
newArray.push(array_return[0]); 
for (var i = 1; i < array_return.length; i++) { 
     if (array_return[i].Product != array_return[i - 1].Product) { 
     newArray.push(array_return[i]); 
     } 
    } 
array_return = newArray; 

我不保證語法是完美的，但這絕對是這個想法。

Answer 3

var array_return = []; 

$(".table__product td:nth-child(1)").each(function() { 
    var value = $(this).html(); 

    // check if a product with value is already exist 
    var exist = array_return.find(function(e){ 
     return e.Product == value; 
    }); 
    // if exist, don't save 
    if(exist) return; 

    // else push it 
    array_return.push({ 
    "Product": value, 
    "valProduct": value 
    }); 
}); 

// no need for more filtering.