Functional Programming - Use the filter Method to Extract Data from an Array

When does the rule for an object needing square brackets apply when using map() and filter()?

For instance with this challenge:

this :

.map(item =>({title: item["Title"], rating: item["imdbRating"]}));

and this:

.filter(item => item.imdbRating >= 8.0)

both seem to work with my code, even when used interchangeably. Based on rules mentioned in prior lessons, the second doesn’t feel like it should be able to call the item correctly since it is in parentheses in the original code.

Thanks in advance!

Your browser information:

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

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

Link to the challenge:

The object can be a variable (and will almost always be one), but the property name cannot be stored in a variable if you want to use dot notation.

In that case, would the first option still be the best practice? Or are there advantages to using the second?

If you are using a literal value in the brackets, the two are identical.

Makes sense, thanks!

1 Like

Is it possible to get a written code snippet as an example of this, please?

You wrote an example yourself:

My bad, I should have been more specific.

What did you mean with this answer?

I didn’t understand how or when the property name would be stored in a variable.

If I write:

const car = {
tires: 4,
doors: "two"
};

As far as I know, neither of the properties have their names in a variable but what kind of code would have a property name set in a variable.

Also, sorry for OP for crashing into your post.

Hello!

No problem, I actually realized this was a two-parter for me as well.

I am also confused about applying the bracket vs dot notation rule to the fact that the property names and values were both surrounded by quotes. How is the dot notation working in this instance?

const keyName = "name";

const myObj = {
  "name": 'john doe',
  height: "5' 9\"",
  age: 40,
  address: '45 Rockefeller Plaza, New York, NY 10111'
}

console.log(myObj.height)//5' 9"
console.log(myObj.keyName)//undefined, eventhough keyName stores the string to get the value of 'john doe'
console.log(myObj.name)//john doe
console.log(myObj[keyName])//john doe, using the string stored in keyName
console.log(myObj["age"])//40, equivalent to writing myObj.age

for(let prop in myObj) {
  console.log(myObj[prop])//will log all the values in myObj
}

The key names in objects are also strings (can be symbols), even if you don’t explicitly type them out as a string when making the object. They might look a little odd in code because they look like variables without the “quotes” around them, but they get turned into strings by Javascript. So i assume item.imdbRating is also just taking that end part and turning it into a string and using it to access the properties.

You cant use a variable with dot notation to access a property. If you are using dot notation then that key name that you use has to be the literal name of one of the properties in that object. But with bracket notation, you can use a string with the exact name like with dot notation ["key"], or a variable [key](key would have to be a variable holding something). In this test you know that you need the value in imdbRating, so you can get away with dot notation or brackets with the string, they are functionally the same thing here.

But bracket notation with variables are much more flexible, allowing you to write less code like in the for loop example depending on what you are doing. So odds are you will see that far more often. And brackets with variables could potentially be reused thought your code, but dot notation or brackets with a string would be hard coded to those values.