How to filter the array using the content of another array?

Question

The code looks as following:

inputArray = [
    { name: 'file1.jpg' },
    { name: 'file1.jpg' },
    { name: 'file2.jpg' },
    { name: 'file3.jpg' },
    { name: 'file4.jpg' }
]

filteringArray = ['file1', 'file2']

const outputArray = inputArray.filter( ? )

I need to filter the inputArrat so that the outputArray should contain only objects, which filenames ('name' property) are in filteringArray.

outputArray = [
    { name: 'file1.jpg' },
    { name: 'file2.jpg' }
]

I've worked so far with simpler filtering conditions, but I'm not sure how to solve this.

.filter(img => filteringArray.includes(img.name.split('.')[0])) — user5734311
– user5734311, Commented Dec 3, 2019 at 10:53
Excuse me, I've made a small change in inputArray. Actually, there could be duplicates, but not in outputArray. — tesicg
– tesicg, Commented Dec 3, 2019 at 11:16

Nick Parsons · Accepted Answer · 2019-12-03 11:19:21Z

4

You can use .some() with .starsWith() to return true if the objects name starts with a file name present in your array like so:

const inputArray = [
    { name: 'file1.jpg' },
    { name: 'file2.jpg' },
    { name: 'file3.jpg' },
    { name: 'file4.jpg' }
];

const filteringArray = ['file1', 'file2'];
const outputArray = inputArray.filter(({name}) => filteringArray.some(file => name.startsWith(file)));

console.log(outputArray);

If you're looking for a solution which has a better time complexity (and has no duplicates), you could create a Map, which stores prefix file names as keys and the literal objects as values. Then, you can .map() your filteringArray using this map:

const inputArray = [
    { name: 'file1.jpg' },
    { name: 'file1.jpg' },
    { name: 'file2.jpg' },
    { name: 'file3.jpg' },
    { name: 'file4.jpg' }
]

const filteringArray = ['file1', 'file2'];
const lut = new Map(inputArray.map(({name}) => [name.split('.').shift(), {name}]));
const outputArray = filteringArray.map(f => lut.get(f));

console.log(outputArray);

edited Dec 3, 2019 at 11:19

answered Dec 3, 2019 at 10:54

Nick Parsons

51.7k6 gold badges61 silver badges80 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

tesicg Over a year ago

Excuse me, I've made a small change in inputArray. Actually, there could be duplicates, but not in outputArray.

Nick Parsons Over a year ago

@tesicg does the second code snippet work for you? It produces unique elements

Avanthika · Accepted Answer · 2019-12-03 10:57:12Z

1

You can use combination of filter and includes!

const inputArray = [
    { name: 'file1.jpg' },
    { name: 'file2.jpg' },
    { name: 'file3.jpg' },
    { name: 'file4.jpg' }
]

const filteringArray = ['file1', 'file2']

const outputArray = inputArray.filter((person) => filteringArray.includes(person.name.split(".")[0]))

console.log(outputArray);

answered Dec 3, 2019 at 10:57

Avanthika

4,1821 gold badge15 silver badges19 bronze badges

1 Comment

tesicg Over a year ago

Excuse me, I've made a small change in inputArray. Actually, there could be duplicates, but not in outputArray.

Jeya Suriya Muthumari · Accepted Answer · 2019-12-04 17:37:08Z

1

You can use a simple function to do filter operation in the array using the filter logic array items as below.

var outputArray = [];
var inputArray = [
    { name: 'file1.jpg' },
    { name: 'file1.jpg' },
    { name: 'file2.jpg' },
    { name: 'file3.jpg' },
    { name: 'file4.jpg' }
];

var filteringArray = ['file1', 'file2'];

function filterItems(arr, query) {
  arr.filter(function(el) {
    query.forEach(function(item){
      if(el.name.toLowerCase().indexOf(item.toLowerCase()) !== -1){
        outputArray.push(el.name);
      }
    });      
  });
}

filterItems(inputArray, filteringArray);

console.log(remove_duplicates(outputArray));

function remove_duplicates(arr) {
    var obj = {};
    var ret_arr = [];
    for (var i = 0; i < arr.length; i++) {
        obj[arr[i]] = true;
    }
    for (var key in obj) {
        ret_arr.push(key);
    }
    return ret_arr;
}

NOTE: Updated the code, Now input array is having duplicate values. And in output array, there is no duplicate entry as I removed duplicates using a function (Remove duplicate values from JS array)

edited Dec 4, 2019 at 17:37

answered Dec 3, 2019 at 11:14

Jeya Suriya Muthumari

2,0513 gold badges31 silver badges50 bronze badges

1 Comment

tesicg Over a year ago

Excuse me, I've made a small change in inputArray. Actually, there could be duplicates, but not in outputArray.

Collectives™ on Stack Overflow

How to filter the array using the content of another array?

3 Answers 3

2 Comments

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related