JSFiddle - React, Tailwind, and code Playground

by Thunder Hemlock

JavaScript

var bikeSpecs = [{
  make: "Aprilia",
  model: "Aprilia Model 1"
}, {
  make: "Aprilia",
  model: "Aprilia Model 2"
}, {
  make: "Moto Guzzi",
  model: "Moto Guzzi Model 1"
}, {
  make: "Moto Guzzi",
  model: "Moto Guzzi Model 2"
}, {
  make: "zero",
  model: "zero Model 1"
}, {
  make: "zero",
  model: "zero Model 2"
}, {}, {
  id: null
}, {
  id: NaN
}, {
  id: 'undefined'
}];
var selectedModels = [];
var selectedMakes = [];

var invalidEntries = 0;
var selectedMakesArray = ["Aprilia", "Moto Guzzi"];
//var thisMake = "Aprilia";
var thisModel = "Aprilia Model 2";

//MAKE
function isMake(obj) {
  return obj;
}

function filterByMake(item) {
  for (i = 0; i < selectedMakesArray.length; i += 1) {
    console.log('this i: ' + i);
    var thisIndex = i;
    var thisObject = bikeSpecs[i];
    var thisMake = bikeSpecs[i].make;
    var thisModel = bikeSpecs[i].model;
    console.log('thisIndex: ' + thisIndex);
    console.log('thisMake: ' + bikeSpecs[i].make);
    console.log('thisModel: ' + bikeSpecs[i].model);

    if (isMake(item.make == thisMake)) {
      selectedMakes.push(item);
      console.log('selectedMakes', selectedMakes);
      return true;
    }
    invalidEntries++;
    return false;

  }
}

var bikeSpecsByMake = bikeSpecs.filter(filterByMake);




//MODEL
function isModel(obj) {
  return obj;
}

function filterByModel(item) {
  for (i = 0; i < selectedMakesArray.length; i += 1) {
    console.log('this i: ' + i);
    var thisIndex = i;
    var thisObject = bikeSpecs[i];
    var thisMake = bikeSpecs[i].make;
    var thisModel = bikeSpecs[i].model;
    console.log('thisIndex: ' + thisIndex);
    console.log('thisMake: ' + bikeSpecs[i].make);
    console.log('thisModel: ' + bikeSpecs[i].model);

    if (isMake(item.make == thisMake)) {
      selectedMakes.push(item);
      console.log('selectedMakes', selectedMakes);
      return true;
    }
    invalidEntries++;
    return false;

  }
}

var bikeSpecsByModel =...