Not understanding the return value evaluation

Hello! This is my first time asking for help, as well as my first time on this forum. I have pasted the snippet from the section that this challenge wants one to change, but could anyone help me understand why this doesn’t work? It returns a movie with a rating of less than 8, and I am thoroughly confused… Much thanks for any help as it is greatly appreciated!

// Only change code below this line

var filteredList = watchList.map(movie => ({

  "title": movie["Title"],

  "rating": movie["imdbRating"]

}));

filteredList.filter(movie => movie["Rating"] >= 8.0)

// Only change code above this line

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.4577.82 Safari/537.36

Challenge: Use the filter Method to Extract Data from an Array

Link to the challenge:

After the map function your objects have a rating property, but not a Rating property.

1 Like

Ah, so I changed it to this:

var filteredList = watchList.map(movie => ({

  "title": movie["Title"],

  "rating": movie["imdbRating"]

}));

filteredList.filter(movie => movie.rating >= 8.0)

// Only change code above this line

This did not work, but when I called filter on the same line, it did work for some reason?

var filteredList = watchList.map(movie => ({

  "title": movie["Title"],

  "rating": movie["imdbRating"]

})).filter(movie => movie.rating >= 8.0)

Thanks for the help. I still don’t really get what the difference is though.

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

1 Like

filter doesn’t mutate the array it’s working on, it returns a new array.

/* This line does not change filteredList.
It instead evaluates to a new array
containing a subset of filteredList,
specifically those values with a rating
property of at least 8. */
filteredList.filter(movie => movie.rating >= 8.0)

That makes sense now.

Sorry about the formatting issues. Thank you all for the help!

1 Like

And just fyi, most people would write this:

var filteredList = watchList.map(movie => ({
  "title": movie["Title"],
  "rating": movie["imdbRating"]
}));

as:

var filteredList = watchList.map(movie => ({
  title: movie.Title,
  rating: movie.imdbRating,
}));

You don’t need quotes around the property names unless they are not valid JS identifiers - some people do this if they were taught JSON and confuse it with a JS object. And you don’t need bracket notation unless the property name is not a valid JS identifier or if it is stored in a variable. In this case, simple dot notation will work.

1 Like

You might also consider using destructuring and renaming the properties.

I switched up the properties just to not have it be solution code, but I’m sure you get the idea and can apply it to the challenge.

var filteredList = watchList
  .map(({ imdbID: id, Metascore: score }) => ({ id, score }))
  .filter(({ score }) => score > 80);

console.log(filteredList);
// [ { id: 'tt0468569', score: '82' }, { id: 'tt0499549', score: '83' } ]

edit: I updated the hint page with a solution using this approach just because I think it’s worth having an example of it.

2 Likes

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.