KnockOut.JS比較兩個數組並從第二個數組中刪除唯一值

-1

我正在Knockout.js上工作。KnockOut.JS比較兩個數組並從第二個數組中刪除唯一值

var chosenFruit = ko.observableArray([]); 
var allFruits = ko.observableArray([]); 

allFruits  =  [ "Apple" , "Bananna" , "Grapes" , "Oranges"] 
chosenFruit  =  ["Apple" , "Bananna" , "kiwi"]

現在，由於「獼猴桃」不存在於第一陣列（這意味着，在allFruits），我想從第二陣列（chosenFruit）除去「獼猴桃」。

我想比較兩個數組並從第二個數組中刪除 - 第一個數組中沒有的值。

這意味着，比較之後的第二陣列應該是：

chosenFruit =  ["Apple" , "Bananna"]

請建議如何實現這一目標。

預先感謝您！

來源

2016-08-12 user2598808

請寫出你嘗試過什麼。 –

使用Array#filter方法

var allFruits = ["Apple", "Bananna", "Grapes", "Oranges"], 
 
    chosenFruit = ["Apple", "Bananna", "kiwi"]; 
 

 
console.log(
 
    // iterate and filter out element 
 
    chosenFruit.filter(function(v) { 
 
    // check value present in array 
 
    return allFruits.indexOf(v) > -1; 
 
    }) 
 
)

更新1：如果你想保持參考使用Array#splice去除元素。

var allFruits = ["Apple", "Bananna", "Grapes", "Oranges"], 
 
    chosenFruit = ["Apple", "Bananna", "kiwi"]; 
 
// store length for iterating 
 
var i = chosenFruit.length; 
 

 
// iterate upto `0` 
 
while (i--) { 
 
    // check value exist in array 
 
    if (allFruits.indexOf(chosenFruit[i]) == -1) { 
 
    // if not present then remove it 
 
    chosenFruit.splice(i, 1); 
 
    } 
 
} 
 

 

 
console.log(chosenFruit);

更新2： 隨着敲除使用Array#filter，其生成新的過濾陣列做這樣的事情。

var chosenFruit = ko.observableArray(["Apple", "Bananna", "Grapes", "Oranges"]); 
 
var allFruits = ko.observableArray(["Apple", "Bananna", "kiwi"]); 
 

 
console.log(
 
    chosenFruit().filter(function(v) { 
 
    return allFruits().indexOf(v) > -1; 
 
    }) 
 
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

更新3：如果您想更新observableArray然後使用remove()方法與回調函數。

var chosenFruit = ko.observableArray(["Apple", "Bananna", "Grapes", "Oranges"]); 
 
var allFruits = ko.observableArray(["Apple", "Bananna", "kiwi"]); 
 

 
allFruits.remove(function(v) { 
 
    return chosenFruit().indexOf(v) == -1; 
 
}); 
 

 
console.log(allFruits())

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

來源

2016-08-12 08:08:40

您並未從'chosenFruit'陣列中刪除任何內容。 – Redu

@Redu：只是分配返回值將做'trickFruit = chosenFruit.filter（函數（v）{ return allFruits.indexOf（v）> -1; }）'.....但它會破壞參考，我不認爲這裏必要的參考 –

不，它不會做的伎倆。如果你這樣做，任何引用'chosenFruit'的數組仍然會顯示[「Apple」，「Bananna」，「kiwi」]。由於賦值運算符（'='），引用將會丟失。 – Redu

你可以做通過定位和刪除不應該是chosenFruits數組中的項目如下。;

allFruits = [ "Apple" , "Bananna" , "Grapes" , "Oranges"], 
 
chosenFruit = ["Apple" , "Bananna" , "Kiwi", "Melon", "Cockroach"]; 
 
    discarded = chosenFruit.reduceRight((p,c,i,a) => !allFruits.includes(c) ? p.concat(a.splice(i,1)) : p,[]); 
 
\t                 
 
console.log(chosenFruit); 
 
console.log(discarded);

對於傳統的功能;

allFruits = [ "Apple" , "Bananna" , "Grapes" , "Oranges"], 
 
chosenFruit = ["Apple" , "Bananna" , "Kiwi", "Melon", "Cockroach"]; 
 
    discarded = chosenFruit.reduceRight(function(p,c,i,a){ 
 
             return allFruits.indexOf(c) === -1 ? p.concat(a.splice(i,1)) 
 
                      : p; 
 
             },[]); 
 
\t                 
 
console.log(chosenFruit); 
 
console.log(discarded);

來源

2016-08-12 09:06:36 Redu

如果這是一個愚蠢的問題，我很抱歉，但是這個符號是什麼「=>」？我試圖用KnockOut.JS在JS文件中實現這一點。 – user2598808

@ user2598808 ES6箭頭功能 –

它在JS文件中工作嗎？我收到語法錯誤。 – user2598808

console.log($(["Apple" , "Bananna" , "kiwi"]).filter([ "Apple" , "Bananna" , "Grapes" , "Oranges"]).get());

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

來源

2016-08-12 10:01:25 Laurianti

謝謝@Laurianti，我需要使用KnockOut.JS – user2598808

KnockOut.JS比較兩個數組並從第二個數組中刪除唯一值

回答

相關問題