For the Right Price explainer

Puzzle Explainer
#1

The aim of this puzzle: Create the underAHundred function and use it as a filter

Walkthrough of the solution: The underAHundred function should take a hotel review object stored in hotel and then it will return whether the .price of that hotel is less than 100. That test is written as hotel.price < 100, and that should be used as the return value.

To use the underAHundred function as a filter for the grasslandHotels, use the .filter() method on it. The argument of the .filter() is a callback function, underAHundred, without parentheses after it. grasslandHotels.filter(underAHundred) will return a copy of the grasslandHotels but only the ones that have a .price property less than 100.

Sample code solution:
(Tap below to reveal)

import { getData, findHotels } from 'grasshopper.reviews';
import { averageRating } from 'myFunctions';

let grasslandHotels = getData('Grassland', findHotels);

function underAHundred(hotel) {
  return hotel.price < 100;
}

let affordableHotels = grasslandHotels.filter(underAHundred);
console.log('Average Rating in Grassland under $100:');
console.log(averageRating(affordableHotels));

JavaScript Concepts: Callback Functions, Calling Functions, Code Block (function), .filter(), import
Additional Code (hidden code that runs before the puzzle’s code):

let _hotelReviews = [
    {
        type: 'Hopaday Inn',
        city: 'Hopalot',
        price: 138,
        rating: 4.0
    },
    {
        type: 'Hopaday Inn',
        city: 'Hopalot',
        price: 78,
        rating: 3.8
    },
    {
        type: 'Hopaday Inn',
        city: 'Hoptropolis',
        price: 86,
        rating: 2.4
    },
    {
        type: 'Hopaday Inn',
        city: 'Hoptropolis',
        price: 126,
        rating: 4.4
    },
    {
        type: 'Hopaday Inn',
        city: 'Grassland',
        price: 98,
        rating: 3.0
    },
    {
        type: 'Hopaday Inn',
        city: 'Grassland',
        price: 245,
        rating: 4.6
    },
    {
        type: 'The Grassy Suites',
        city: 'Hopalot',
        price: 189,
        rating: 4.4
    },
    {
        type: 'The Grassy Suites',
        city: 'Hopalot',
        price: 111,
        rating: 2.4
    },
    {
        type: 'The Grassy Suites',
        city: 'Hoptropolis',
        price: 171,
        rating: 2.8
    },
    {
        type: 'The Grassy Suites',
        city: 'Hoptropolis',
        price: 191,
        rating: 2.8
    },
    {
        type: 'The Grassy Suites',
        city: 'Grassland',
        price: 185,
        rating: 4.1
    },
    {
        type: 'The Grassy Suites',
        city: 'Grassland',
        price: 86,
        rating: 3.5
    },
    {
        type: 'Hopton Inn',
        city: 'Hopalot',
        price: 160,
        rating: 2.4
    },
    {
        type: 'Hopton Inn',
        city: 'Hoptropolis',
        price: 226,
        rating: 4.5
    },
    {
        type: 'Hopton Inn',
        city: 'Hoptropolis',
        price: 192,
        rating: 3.5
    },
    {
        type: 'Hopton Inn',
        city: 'Grassland',
        price: 189,
        rating: 4.9
    }
];


const getData = (city, afunction) => {
   afunction(city.trim().charAt(0).toUpperCase() + city.trim().toLowerCase().slice(1));
};

const findHotels = city => {
   _hotelReviews.filter( review => review.city === city);
};

const averageRating = hotelList => {
   hotelList.map(hotel => hotel.rating).reduce((a, b) => a + b) / hotelList.length
};
3 Likes
#3

image
847CFC09-50D2-4D08-B0DB-A483058B80CE.png750×1624 152 KB

I don’t understand what the problem is…

#4

Hey there,

You’ve got the right idea, you’ve just put the code in the wrong place.

Try resetting the puzzle so you’ve got the starter code back. Then enter your code on the line:

let affordableHotels = grasslandHotels;

so it becomes:

let affordableHotels = grasslandHotels.filter(underAHundred);

Hope this helps! Let me know if you have any questions.
Ben

#5

Tnx Ben!

Very helpful!

#6

He should insert in above the line or below. …do not understand how he should put it on the existing line of the code

#7

Hi there this is how the code must look

grasshopper
Screenshot_20191023_013100_com.area120.grasshopper.jpg1080×2160 393 KB

4 Likes
#8

Hi Ben,

Thanks for the explanation above,

Will this not work,

console.log(averageRating(affordableHotels.filter(underAhundered));

#9

Hi there,

console.log(averageRating(affordableHotels.filter(underAHundred))); also works, but I wouldn’t recommend it. The reason depends on what you’ve set for the value of affordableHotels.

If you’ve declared

let affordableHotels = grasslandHotels;

then affordableHotels is the same as grasslandHotels. If they’re the same, there’s no need for the affordableHotels variable. I’d just use console.log(averageRating(grasslandHotels.filter(underAHundred)));.

Alternatively, if you’ve declared

let affordableHotels = grasslandHotels.filter(underAHundred);

then console.log(averageRating(affordableHotels.filter(underAHundred))); is redundant - affordableHotels already contains all the hotels that have a price less than 100. I’d just use console.log(averageRating(affordableHotels));

In any case, because of the way the validation is written for this puzzle, stick to the solution code above to advance to the next puzzle.

Hope this helps! Let me know if you have any questions.
Natalie

1 Like
#10

How come we need to use .filter on grasslandHotels when the underAHundred function is already returning .price properties less than 100?

Wouldnt let affordableHotels = grasslandHotels(underAHundred) do the same thing?

Edit: Or is the filter method the only way to create an array in this case?

#11

Hey there, the underAHundred() function just looks at one single object, and returns true if its price property has a value under 100, or false if it does not.

We use this function with Array.filter() to look at an array of objects, and return only the objects where underAHundred() returns true. This gives us an array of only the objects that have a price under 100.

Hope this helps!
Ben

#12

The only tiny issue I have is with the starter code. Where do all that code come from? (e.g. import ___ …etc).

Thanks.

#13

Hey there,

Because of limited screen space on mobile devices, we sometimes use hidden additional code to create variables and functions that aren’t really relevant to the lesson being taught. We then import these hidden variables and function into the puzzle.

Whenever a puzzle uses additional code, we show it on the forum in the puzzle explainer post. You can view it by scrolling up to the top of this post.

Hope this helps!
Ben

#15

Hey,
Thank you Grasshopper for this very helpful and free tutorials. I am really grateful for it all.

I did understand what I was doing and what you guys wanted us to learn in the ‘Hotel hunting’ puzzles but not so with the codes itself.

The hidden codes makes it impossible for me to know what exactly those functions are carrying out. I understand better when I can read codes from the very beginning; it will be more easy to grasp and interpret. (I believe this is so with some learners too).

And yes, I did looked at the hidden but unfortunately, I couldn’t understand much of what it was saying.

1 Like