'Looping through objects in arrays to compare values

I have two arrays composed of objects. One array is made of restaurant objects with properties name and averagePrice. The other array is made of price objects (cheap, medium, expensive) with properties label, lowEnd, and highEnd. lowEnd and highEnd represent the thresholds that determine if the restaurant is cheap, medium, or expensive. I want to create a function that loops through the restaurants, and returns the restaurant whose average price lands within the given price range. I get an error that says:

Cannot read properties of undefined (reading: lowEnd)

I know that this is because I am not properly targeting the array object property of the price. Can someone help me figure out how to properly target an array object property? Thanks

Here is my code

    const priceArray = [
    cheap = {label: '$', lowEnd: 10, highEnd: 20},
    medium = {label: '$$', lowEnd: 21, highEnd: 30},
    expensive = {label: '$$$', lowEnd: 31, highEnd: 40},

];


const restaurants = [
    McDonalds = {name: 'Mcdonalds', averagePrice: 12},
    Sushi = {name: 'Sushi', averagePrice: 25},
    Steak = {name: 'Steak', averagePrice: 35}
];




function showRestaurants(price) {
    for (let restaurant of restaurants) {
    //if the average price is cheap, log that restaurant
            if (restaurant.averagePrice >= priceArray.price.lowEnd && restaurant.averagePrice < priceArray.price.highEnd)
                console.log(restaurant);
        }
};

showRestaurants(medium);


Solution 1:[1]

You don't have priceArray.price and priceArray is also an array with key names cheap, medium, and expensive

You've already passed medium as the data you want to check correctly, so I'd suggest you should use price param in showRestaurants(price) instead. In this case, it will consider medium as price

showRestaurants(medium);

The possible fix could be

  • priceArray.price.lowEnd to price.lowEnd
  • priceArray.price.highEnd to price.highEnd

const priceArray = [
  cheap = {
    label: '$',
    lowEnd: 10,
    highEnd: 20
  },
  medium = {
    label: '$$',
    lowEnd: 21,
    highEnd: 30
  },
  expensive = {
    label: '$$$',
    lowEnd: 31,
    highEnd: 40
  },

];


const restaurants = [
  McDonalds = {
    name: 'Mcdonalds',
    averagePrice: 12
  },
  Sushi = {
    name: 'Sushi',
    averagePrice: 25
  },
  Steak = {
    name: 'Steak',
    averagePrice: 35
  }
];




function showRestaurants(price) {
  for (let restaurant of restaurants) {
    //if the average price is cheap, log that restaurant
    if (restaurant.averagePrice >= price.lowEnd && restaurant.averagePrice < price.highEnd)
      console.log(restaurant);
  }
};

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

Solution 2:[2]

You can do something like this

 const priceArray = [
    {label: '$', lowEnd: 10, highEnd: 20},
    {label: '$$', lowEnd: 21, highEnd: 30},
    {label: '$$$', lowEnd: 31, highEnd: 40},

];


const restaurants = [
     {name: 'Mcdonalds', averagePrice: 12},
   {name: 'Sushi', averagePrice: 25},
   {name: 'Steak', averagePrice: 35}
];

const withPriceLabel  =  restaurants.map(r => {
 return {
   ...r,
   priceEvaluation: priceArray.find(p => r.averagePrice >= p.lowEnd && r.averagePrice <= p.highEnd).label
 }
})

console.log(withPriceLabel.filter(r => r.priceEvaluation === '$'))

Solution 3:[3]

Nick. Here's a quick solution

const CHEAP = { label: "$", lowEnd: 10, highEnd: 20 };
const MEDIUM = { label: "$$", lowEnd: 21, highEnd: 30 };
const EXPENSIVE = { label: "$$$", lowEnd: 31, highEnd: 40 };

const priceArray = [CHEAP, MEDIUM, EXPENSIVE];

const McDonalds = { name: "Mcdonalds", averagePrice: 12 };
const Sushi = { name: "Sushi", averagePrice: 25 };
const Steak = { name: "Steak", averagePrice: 35 };

const restaurants = [McDonalds, Sushi, Steak];

function showRestaurants(price) {
  const filteredRestaurants = [];

  //filtering the category
  const categories = priceArray.filter((level) => {
    return level.lowEnd < price && price < level.highEnd;
  });

  ////filtering the restaurants
  restaurants.map((restaurant) => {
    categories.map((category) => {
      if (
        category.lowEnd < restaurant.averagePrice &&
        restaurant.averagePrice < category.highEnd
      ) {
        filteredRestaurants.push(restaurant);
      }
    });
  });

  filteredRestaurants.map((restaurant) => console.log(restaurant.name));
}

showRestaurants(15);

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 R4ncid
Solution 3 Cássio Freitas