How to filter an array of objects by the element inside an inner array - Functional Programming Javascript

Question

Still working my way through functional programming: .forEach(), .map(), .filter(), .reduce().

I'm working through a new challenge.

var bikes = [
   {name: 'Cinelli Bolt', price: '2000', age: 1, singlespeed: 'yes', features: ['tubeless tires', 'disk brakes', 'carbon frame']},
   {name: 'Cinelli Mash', price: '1700', age: 3, singlespeed: 'yes', features: ['gatorskin tyres', 'sram drivetrain', 'steel frame']},
   {name: 'Specialized Langster', price: '1000', age: 1, singlespeed: 'no', features: ['two speed enclosed hub', 'bullbars', 'carbon frame']}
 ];

I'm trying to filter the array by a specific feature 'carbon frame'. I was thinking about using filter but I'm confused about calling the feature inside the key.value pair.

var justCarbonBikes = bikes.filter(function(bike) {
  return bike.features['carbon frame'];
});

Expected result should modify the original array:

var bikes = [
   {name: 'Cinelli Bolt', price: '2000', age: 1, singlespeed: 'yes', features: ['tubeless tires', 'disk brakes', 'carbon frame']},
   {name: 'Specialized Langster', price: '1000', age: 1, singlespeed: 'no', features: ['two speed enclosed hub', 'bullbars', 'carbon frame']}
 ];

Nina Scholz · Accepted Answer · 2017-04-26 11:26:27Z

2

You were almost there. With the check of the index with Array#indexOf, you could use it as return value.

return bike.features.indexOf('carbon frame') + 1;

var bikes = [{ name: 'Cinelli Bolt', price: '2000', age: 1, singlespeed: 'yes', features: ['tubeless tires', 'disk brakes', 'carbon frame'] }, { name: 'Cinelli Mash', price: '1700', age: 3, singlespeed: 'yes', features: ['gatorskin tyres', 'sram drivetrain', 'steel frame'] }, { name: 'Specialized Langster', price: '1000', age: 1, singlespeed: 'no', features: ['two speed enclosed hub', 'bullbars', 'carbon frame'] }],
    justCarbonBikes = bikes.filter(function(bike) {
        return bike.features.indexOf('carbon frame') + 1;
    }),
    bikesWithoutCarbon = bikes.filter(function(bike) {
        return bike.features.indexOf('carbon frame') === -1;
    });

console.log(justCarbonBikes);
console.log(bikesWithoutCarbon);

.as-console-wrapper { max-height: 100% !important; top: 0; }

ES6 with Array#includes as return value.

var bikes = [{ name: 'Cinelli Bolt', price: '2000', age: 1, singlespeed: 'yes', features: ['tubeless tires', 'disk brakes', 'carbon frame'] }, { name: 'Cinelli Mash', price: '1700', age: 3, singlespeed: 'yes', features: ['gatorskin tyres', 'sram drivetrain', 'steel frame'] }, { name: 'Specialized Langster', price: '1000', age: 1, singlespeed: 'no', features: ['two speed enclosed hub', 'bullbars', 'carbon frame'] }],
    justCarbonBikes = bikes.filter(b => b.features.includes('carbon frame')),
    bikesWithoutCarbon = bikes.filter(b => !b.features.includes('carbon frame'));

console.log(justCarbonBikes);
console.log(bikesWithoutCarbon);

.as-console-wrapper { max-height: 100% !important; top: 0; }

edited Apr 26, 2017 at 11:26

answered Apr 26, 2017 at 11:12

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

2 Comments

alanionita Over a year ago

How could I negate the function: all bikes that are don't have a feature of 'carbon frame'?

Nina Scholz Over a year ago

you could check the result or negate it, as with includes.

Parth Acharya · Accepted Answer · 2017-04-26 11:11:11Z

1

This is one solution, you can loop through features inside the filter function and return if you find carbon frame

var justCarbonBikes = bikes.filter(function(bike) {
  for(let i of bike.features){
    if(i == 'carbon frame'){
      return bike
    }
  }
});

answered Apr 26, 2017 at 11:11

Parth Acharya

5453 silver badges13 bronze badges

1 Comment

alanionita Over a year ago

Nice, I prefer this to filter because you could specific agains a certain criteria: if I wanted all of the bikes that weren't carbon frames. 👍

Collectives™ on Stack Overflow

How to filter an array of objects by the element inside an inner array - Functional Programming Javascript

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related