通过比较具有不同元素的两个对象数组来过滤和删除项目

Question

I have two arrays

arr1 = [{path: "path1"}, {path: "path2"}];
arr2 = [{path: "path1"}];

First, I want to find the element that is removed from arr1 (in this case its path1 object) by comparing two arrays and manipulate the first array or overwrite it by removing the item. In this case the expected array is

expArray = [{path: "path2"}]

I have tried using array.filter method.

var filteredElements = arr1 .filter(function(obj) {
    return !arr2 .some(function(obj2) {
        return obj.Path === obj2.Path;
    });    
});

But it only gives the list of element that are different, but does not support removing the element from the array. Is there a way to do this using underscore or traditional way ?

Answer 1

You have a typo of Path vs path . The code works with this change.

 var arr1 = [{ path: "path1" }, { path: "path2" }], arr2 = [{ path: "path1" }], filteredElements = arr1.filter(function(obj) { return !arr2.some(function(obj2) { return obj.path === obj2.path; // ^ ^ }); }); console.log(filteredElements); 

If you like to mutate arr1 you could splice unwanted elements and because this changes the length, you could iterate from the end.

 var arr1 = [{ path: "path1" }, { path: "path2" }], arr2 = [{ path: "path1" }], i = arr1.length; while (i--) { if (arr2.some(({ path }) => arr1[i].path === path)) { arr1.splice(i, 1); } } console.log(arr1); 

Answer 2

You can use Array#splice to remove the element from an existing array.

 let arr1 = [{ path: "path1" }, { path: "path2"}]; let arr2 = [{ path: "path1" }]; // get length of array for iteration let l = arr1.length; // iterate from end to start to avoid skipping index after removing an element while (l--) { // check elemnt present in the array if (arr2.some(obj => obj.path === arr1[l].path)) // remove the element arr1.splice(l, 1); } console.log(arr1); 

Answer 3

I believe you just typed the path property as Path and it is returning an empty array.

The code working:

var arr1 = [{path: "path1"}, {path: "path2"}];
var arr2 = [{path: "path1"}];

var filteredElements = arr1.filter(function(obj) {
  return !arr2.some(function(obj2) {
    return obj.path === obj2.path;
  });
});

If you want to overwrite the first array, just replace filteredElements by arr1 .

Answer 4

you can use map,

 let arr1 = [{ path: "path1" }, { path: "path2"}]; const arr2 = [{ path: "path1" }]; const itemsToRemove = arr2.map(a => a.path); arr1 = arr1.filter(a => !itemsToRemove.includes(a.path)); console.log(arr1); 

filter and reassign the array values.

Answer 5

Another way to handle this is to separate the logic for testing whether two items are equal from the process of filtering the data. Here, keep is a very simple higher-order function. We pass it a function that reports whether two object have the same path property and get back a function on two arrays.

We then simply use that function.

 const keep = (eq) => (xs, ys) => xs.filter ( x => ys .some ( y => eq(x, y) ) ) const keepByPath = keep ( (x, y) => x.path == y.path ) const arr1 = [{ path: "path1", foo: 1 }, { path: "path2", foo: 2 }] const arr2 = [{ path: "path1", bar: 1 }] console.log ( keepByPath (arr1, arr2) //~> [{ path: "path1", foo: 1 }] ) 

Note that I added some properties. These demonstrate that we keep only items from the first array.